Bouton-image qui change au clic de la souris
Résolu
flo4020
Messages postés
44
Date d'inscription
Statut
Membre
Dernière intervention
-
flo4020 Messages postés 44 Date d'inscription Statut Membre Dernière intervention -
flo4020 Messages postés 44 Date d'inscription Statut Membre Dernière intervention -
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 :
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
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
A voir également:
- Bouton-image qui change au clic de la souris
- Changer de dns - Guide
- Quelle touche pour débloquer la souris ? - Guide
- Clic droit sans souris - Forum Windows 10
- Image iso - Guide
- Bouton shift pc ✓ - Forum Jeux vidéo
4 réponses
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:
Ce qui aura pour effet d'empêcher le lien de fonctionner...
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...
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?
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?
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
}
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
}
