Se connecter avec
S'enregistrer | Connectez-vous

Survol d'une image

Dernière réponse : dans Programmation

Bonjour, j'ai utilisé ce code, trouvé sur un post plus ancien, afin de faire un bouton interactif mais le problème est que quand je mets deux boutons de cette nature sur une même page, le premier (qui marchait très bien) ne marche plus et le deuxième non plus. Que se passe-t-il ?

<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

Autres pages sur : survol image

Lassé par la pub ? Créez un compte
Expert Programmation

Il faut utilisé le CSS:

  1. .bouton
    

  2. {
    

  3.        background-image: url("ton_image1.jpg");
    

  4. }
    

  5. .bouton:hover
    

  6. {
    

  7.        background-image: url("ton_image2.jpg");
    

  8. }
    

  9. .bouton:active
    

  10. {
    

  11.        background-image: url("ton_image3.jpg");
    

  12. }


Si tu ne le connais pas encore clique ici

A+ :hello: 

Entre <head> et </head> ajoute une balise <style>

Pour le code de PetitTigre voici ce que cela donne ;-)

<head>
<style>
bouton
{
background-image: url("ton_image1.jpg" );
}
bouton:hover
{
background-image: url("ton_image2.jpg" );
}
bouton:active
{
background-image: url("ton_image3.jpg" );
}
</style>
</head>
Lassé par la pub ? Créez un compte

Créer un nouveau sujet

Tom's guide dans le monde