gif apparait/remplacer en js ou css lorsque souris pointe lien

gif apparait/remplacer en js ou css lorsque souris pointe lien - HTML/CSS - Programmation

Marsh Posté le 16-09-2008 à 15:43:44    

Bonjour,
 
J'aimerais qu'un petit gif apparaisse à la gauche du lien quand ma souris passe sur le lien, et que le gif par défaut revienne quand je pointe ailleurs.
J'ai trouvé ça mais cela ne fonctionne pas quand je veux faire la même chose sur plusieurs liens dans la page avec les mêmes images...
 
Une idée ?
(ça peut marcher aussi ac du css peut être ?)
Merci :)

Reply

Marsh Posté le 16-09-2008 à 15:43:44   

Reply

Marsh Posté le 16-09-2008 à 16:55:59    

Voici la solution que j'utilise pour afficher des petites marbles (billes) à côté d'un lien et faire changer la couleur de la bille quand je passe au dessus du lien :

Code :
  1. <html>
  2. <head>
  3. </style>
  4. <script language=javascript>
  5. if (document.images) {
  6.    marbleg = new Image
  7.    marbleg.src = 'mgreen.gif'
  8.    marbley = new Image
  9.    marbley.src = 'myellow.gif'
  10. }
  11. else {
  12.    marbleg = ""
  13.    marbley = ""
  14. }
  15. </script>
  16. </head>
  17. <body>
  18. <img src="mgreen.gif" width=13 height=13 name="mm01">
  19. <a href="toto.htm"
  20. onmouseover="images['mm01'].src=marbley.src"
  21. onmouseout="images['mm01'].src=marbleg.src">Toto</a>
  22. <p>
  23. <img src="mgreen.gif" width=13 height=13 name="mm02">
  24. <a href="titi.htm"
  25. onmouseover="images['mm02'].src=marbley.src"
  26. onmouseout="images['mm02'].src=marbleg.src">Titi</a>
  27. </body>
  28. </html>


Message édité par olivthill le 16-09-2008 à 16:57:28
Reply

Marsh Posté le 16-09-2008 à 17:41:06    

C'est le même code que le miens !
Tout simplement, je devais rajouter des numéros (en ramplaçant le 1 par 2, ensuite 3 etc.)
 
MERCI olivthill ! :)

Reply

Marsh Posté le 17-09-2008 à 09:54:17    

et dire qu'en css il faut 2 lignes tout en restant accessible.
A{display:block;width:Xpx; height:Xpx;background:url(mon image qui contient les 2 billes une au dessus de l'autre) no-repeat left top;padding-left:Xpx}
A:hover{background-position:left bottom;}


Message édité par Lactique le 17-09-2008 à 09:54:41

---------------
Studio CréeAll
Reply

Marsh Posté le 17-09-2008 à 10:15:44    

Je voulais pas trop en demander mais j'aurais voulu aussi une réponse en css merci :)
Sauf que là ça ne me fait pas la même chose, car l'image apparait en background du lien alors que je veux les images à gauche du lien...

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed