11548 sujets

JavaScript, DOM et API Web HTML5

Salut salut,
ça me semble très bateau comme question mais après quelques lectures je n'ai pas trouvé de solution satisfaisantes.
J'ai donc un machin très simple comme ça :

 <div class="contour" onMouseOver="this.style.backgroundImage='url(/chouchouc/back_s_bloc_expe.png)';" onMouseOut="this.style.backgroundImage='url(/chouchou/back_s_bloc_expe.png)';" >Yeah</div>


Et euh donc la question c'est : comment je reviens à l'état "pas d'image" proprement?
PS: avec un "undefined" ou un "null" ça marche sur FF mais pas sur Ie (probablement parce que c'est une méthode de petit goret)...
Merci de votre aide.
Modifié par Thinkedou (19 Dec 2007 - 15:07)
Modérateur
Salut, Smiley smile

Le mieux serait déjà que tu externalises tes instructions JS en sélectionnant ton conteneur via DOM (voir document.getElementsByTagName et document.getElementById); ça simplifierait la maintenance puisque tout ton code JS serait dans un fichier ce qui permettrait à ton (x)html de rester "propre".
De là, plutôt que de passer par l'objet style de JS (utile uniquement pour les animations), il serait préférable d'affecter une classe CSS contenant ton background au mouseover et de la supprimer au mouseout. Le fait de passer par une classe permet de n'affecter que les medias que tu traites réellement.
Salut koala64 et merci pour ta réponse.
J'ai entre temps finalement trouvé une solution.
Pour le reste je suis au courant des bonnes pratiques mais en l'occurence elles ne s'appliquent pas à ce projet.
Je pense que c'est une discussion qui a du avoir lieu mille fois mais je ne considère pas cela comme un plus d'externaliser un fichier js pour faire des opérations aussi simples. De plus, en fonction des paramètres passés et des options de tri je sollicite tel ou tel fonction, je devrais donc soit effectuer des tests avant chaque inclusion soit charger des fonctions js qui ne seront pas utilisé.
Et j'ai tendance à avoir la même reflexion pour la création de deux classe .css qui ne seront utilisé que dans un cas sur 4. (même si là je peux plus facilement mettre ces classes dans ma page, c'est vrai).