CSS et images
Nemo
-
Nemo -
Nemo -
Bonjour,
je créé un site internet. Dans celui-ci, se trouve un menu avec plusieurs bouton. J'ai créer des bouton au format PNG. Je voudrais que lorsque l'utilisateur passe sa souris sur le bouton (donc sur l'image), celle-ci change. J'ai donc créé deux type un "libre" et l'autre "enclenché".
Comment coder mon CSS (si c'est possible) pour que lorsque la souris passe sur l'image, celle-ci change...
merci d'avance
je créé un site internet. Dans celui-ci, se trouve un menu avec plusieurs bouton. J'ai créer des bouton au format PNG. Je voudrais que lorsque l'utilisateur passe sa souris sur le bouton (donc sur l'image), celle-ci change. J'ai donc créé deux type un "libre" et l'autre "enclenché".
Comment coder mon CSS (si c'est possible) pour que lorsque la souris passe sur l'image, celle-ci change...
merci d'avance
A voir également:
- CSS et images
- Des images - Guide
- Extraire images pdf - Guide
- Recherche images - Guide
- 4 images 1 mot niveau 10 chaperon rouge ✓ - Forum Jeux vidéo
- Supprimez les composantes rouge et verte de cette image. quel mot apparaît ? ✓ - Forum Photoshop
8 réponses
Si les boutons dont tu parles sont des liens et que l'image est en background, tu peux utiliser la propriété css "a:hover" pour changer le background de ton lien au moment du survol.
Sinon, comme l'a dit ACervoise tu peux utiliser le js.
Sinon, comme l'a dit ACervoise tu peux utiliser le js.
Tu dois utiliser la pseudo class hover
exemple :
Attention IE 6 ne comprends pas la pseudo class hover
Solution inclure un fichier .htc (cf google: htc+hover+ie)
Sinon javascript, c'est peut être plus simple si tu veux que ça passe sous ie 6
exemple :
div {
background: url(imgoff.png)
}
div:hover {
background: url(imgon.png)
}
Attention IE 6 ne comprends pas la pseudo class hover
Solution inclure un fichier .htc (cf google: htc+hover+ie)
Sinon javascript, c'est peut être plus simple si tu veux que ça passe sous ie 6
en javascript
<a href="" onmouseover="lehover.src='tonimage2.png'" onmouseout="lehover.src='tonimagedebase.png'"><img src="tonimagedebase.png" border="0" alt="image" name="lehover" /></a>
<a href="" onmouseover="lehover.src='tonimage2.png'" onmouseout="lehover.src='tonimagedebase.png'"><img src="tonimagedebase.png" border="0" alt="image" name="lehover" /></a>
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
bonjour, je viens à l'instant de trouver comment le faire sans javascript...
<img src="image1.png" name="image" onmouseover="image.src='image2.png'" onmouseout="image.src='image1.png'" onmousedown="image.src='image3.png'" />
image1 : normale
image2 : sulvolée
image3 : enfoncée
merci
<img src="image1.png" name="image" onmouseover="image.src='image2.png'" onmouseout="image.src='image1.png'" onmousedown="image.src='image3.png'" />
image1 : normale
image2 : sulvolée
image3 : enfoncée
merci
mais c'est du javascript ça? je croyais qu'il fallait le céclarer avec <script></script> ou quelque chose qomme ça...