JS - XHTML - question sur onmouseover

Marsh Posté le 19-04-2010 à 17:17:56

Bonjour à tous,

J'essaie tant bien que mal de m'initier à javascript, mais je crois bien que ça ne veut pas rentrer J'ai un petit problème avec mes onmouseout ... Si quelqu'un à 5 min?

Voici mon code dans le head

Code :

<script type="text/javascript">
this = new Image();
this.src = "boutonover1.gif";
</script>

et après dans mon body

Code :

<br />
<a href="acceuil.htm">
<img alt="" src="bouton1.gif" onmouseover="this.src='boutonover1.gif'" onmouseout="this.src='bouton1.gif'"/>
</a>

Jusque là, tout marche comme il faut, validé w3c xhtml blah blah...
MAIS! Ce n'est que le premier bouton de mon menu, et j'en ai 4 autres !

Du coup, j'ai pensé faire ça, mais ça ne marche pas, on dirait que seul this marche?

Code :

<script type="text/javascript">
this = new Image();
this.src = "boutonover1.gif";
tutu = new Image();
tutu.src = "boutonover2.gif";
</script>

Code :

<br />
<a href="acceuil.htm">
<img alt="" src="bouton1.gif" onmouseover="this.src='boutonover1.gif'" onmouseout="this.src='bouton1.gif'"/>
</a>
<br />
<a href="preso.htm">
<img alt="" src="bouton2.gif" onmouseover="tutu.src='boutonover2.gif'" onmouseout="tutu.src='bouton2.gif'"/>
</a>

Quelqu'un aurait il une idée? C'est certainement tout bête, mais là je sèche... :??:
merci à tous beaucoup d'avance
+

Reply

Marsh Posté le 19-04-2010 à 17:17:56

Reply

Marsh Posté le 19-04-2010 à 17:47:53

En fait , je ne comprends même pas pourquoi tu emploie du js pour faire cela.
Mets ton image en background du <a> et emploie la pseudo class :hover pour la faire varier.

Et corrige ton html, il devrait être

Code :

<ul class="nav_level_1">
<li><a href="acceuil.htm">Acceuil</a></li>
<li><a href="perso.htm">Perso</a></li>
</ul>

edit:typo

Message édité par David Boring le 19-04-2010 à 17:48:42

Reply

Marsh Posté le 19-04-2010 à 17:53:18

Mouais, il a pas tout faux le david... Sinon une petite explication du bouzin que tu utilise et qui ferait passer la momie de ramses II pour une decouverte recente.
Tes scripts servent juste a 'preloader' les images pour que ce soit dans le cache, ton script sur chaque image n'as aucune raison valable de faire reference aux memes objets.
En resume, essaye tout betement :

Code :

<script type="text/javascript">
titi = new Image();
titi.src = "boutonover1.gif";
toto = new Image();
toto.src = "boutonover1.gif";
</script>
...
<br />
<a href="acceuil.htm">
<img alt="" src="bouton1.gif" onmouseover="this.src='boutonover1.gif'" onmouseout="this.src='bouton1.gif'"/>
</a>
<br />
<a href="preso.htm">
<img alt="" src="bouton2.gif" onmouseover="this.src='boutonover2.gif'" onmouseout="this.src='bouton2.gif'"/>
</a>

Reply

Marsh Posté le 19-04-2010 à 18:05:10

Merci beaucoup pour vos réponses !

David, si je met l'image en background, je serai obligé de faire le lien sur le texte, non? parce que mon image contient déjà le titre...

Fred, effectivement, ça marche!!! merci beaucoup ! Question en plus, est ce vraiment nécessaire de faire un préload pour des images ne faisant que 3ko?

Reply

Marsh Posté le 19-04-2010 à 18:52:05

En fait, tu dois cacher le texte. Tu peux le mettre dans un span, et donc faire

Code :

.nav_level_1 span {position:absolute; left:-9000px}

Et pour ne pas loadé l'image au moment du hover, tu emplois un sprite.

Reply

JS - XHTML - question sur onmouseover

Sujets relatifs:

Leave a Replay