Bouton-image qui change au clic de la souris [Résolu/Fermé]

Signaler
Messages postés
44
Date d'inscription
mercredi 13 avril 2011
Statut
Membre
Dernière intervention
1 novembre 2016
 -
Messages postés
44
Date d'inscription
mercredi 13 avril 2011
Statut
Membre
Dernière intervention
1 novembre 2016
 -
Bonjour,


J'aimerai savoir comment faire pour qu'un bouton (image personnalisée) se change en une autre image (plus sombre) au clic de la souris pour faire un effet de pression du bouton.

J'ai essayé d'intégrer onclic à mon code html mais ça ne marche pas...
Voici le code de mon image de menu : 

 <div class="element_menu">
       <h3><a href="Inscriptions.php"><img src="Inscriptionsbtn.png" alt="Inscrivez vous !" width="163" height="42" hspace="0" border="0" title="Inscriptions"
       onmouseover="this.src='Inscriptionseffetover.png';"onmouseout="this.src='Inscriptionsbtn.png';"
       onclick="this.src='Boutononclick.png'"
       /></a></h3>


J'ai regardé pas mal de recherches mais je n'arrive pas à trouver la solution. Faut il obligatoirement passer par du javascript?

D'avance merci

4 réponses

Réponse 1 / 4
Messages postés
85
Date d'inscription
vendredi 22 avril 2005
Statut
Membre
Dernière intervention
15 février 2018
 28
Es-tu sûr que cela ne marche pas? (à première vue, le code est bon). Parce que si le fait de cliquer provoque le chargement d'une nouvelle page (en l'occurrence la page Inscriptions.php), le temps d'afficher le nouveau bouton, l'ancienne page est sans doute déjà partie !

Pour le vérifier, modifie comme suit: 
onclick="this.src='Boutononclick.png'; return false;"


Ce qui aura pour effet d'empêcher le lien de fonctionner...
Réponse 2 / 4
Messages postés
1314
Date d'inscription
samedi 10 novembre 2007
Statut
Membre
Dernière intervention
30 octobre 2011
 128
Un simple hover en css ne suffirai-t-il pas ?
Signaler
Messages postés
1314
Date d'inscription
samedi 10 novembre 2007
Statut
Membre
Dernière intervention
30 octobre 2011
 128
http://css.mammouthland.net/rollover-pseudo-classe-css-hover.php
Réponse 3 / 4
Messages postés
44
Date d'inscription
mercredi 13 avril 2011
Statut
Membre
Dernière intervention
1 novembre 2016
 1
Merci pour cette réponse rapide
Tu as raison c'est bien le rechargement de l'image qui fait que ça ne marche pas...
Mais du cou je m'aperçois que ce n'est pas au clic que l'image change mais au rélachement du clic...
Pas très esthétique...
Il y aurait une autre solution?
Signaler
Messages postés
1314
Date d'inscription
samedi 10 novembre 2007
Statut
Membre
Dernière intervention
30 octobre 2011
 128
Mon hover ! :)

Pour ne pas généraliser sur tous les liens, je te conseil de faire un <span id='inscription'> TON lien, ton image, blabla </span>

Puis dans le fichier CSS,

#inscription:hover {
mmhh d'après mes souvenir ce serai un background-attachment avec donc le liens de ton image en plus foncé et hop
}
Signaler
Messages postés
85
Date d'inscription
vendredi 22 avril 2005
Statut
Membre
Dernière intervention
15 février 2018
 28
remplacer 
onclick

par 
onmousedown


;-)
Réponse 4 / 4
Messages postés
44
Date d'inscription
mercredi 13 avril 2011
Statut
Membre
Dernière intervention
1 novembre 2016
 1
Merci beaucoup à vous pour c réponses!!

Pb résolu!!!
Posez votre question