Apparaitre image sur texte en y posant souris
benhayounix
Messages postés
17
Date d'inscription
Statut
Membre
Dernière intervention
-
Groarh Messages postés 682 Date d'inscription Statut Membre Dernière intervention -
Groarh Messages postés 682 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
svp je veux savoir comment faire apparaitre une image si quelqun pose la souris sur un texte
je veux que quand quelqun pose la souris dans le nom d'un jeux de mon site l'image du jeux apparait
Merci.
svp je veux savoir comment faire apparaitre une image si quelqun pose la souris sur un texte
je veux que quand quelqun pose la souris dans le nom d'un jeux de mon site l'image du jeux apparait
Merci.
A voir également:
- Apparaitre image sur texte en y posant souris
- Comment faire apparaître le curseur sans souris - Guide
- Apparaitre hors ligne instagram - Guide
- Comment activer le pavé tactile sans souris - Guide
- Transcription audio en texte word gratuit - Guide
- Comment faire apparaître la tabulation sur word - Guide
1 réponse
Hello !
P'tit coup de JavaScript. Il faut surveiller l'évènement mouseover de la balise HTML qui contient le nom de ton jeu (et mouseout pour retirer l'image quand la souris repart).
Comme d'habitude quand je commence à parler d'évènements JavaScript, j'aime bien dire qu'il y a une mauvaise et une bonne méthode. Cependant, j'imagine que tu es débutant en JavaScript alors je commence par te conseiller la mauvaise méthode car elle est plus facile ;)
Il faut rajouter les attributs onmouseover et onmouseout à la balise HTML de ton texte. Ces attributs doivent contenir du code JS qui va afficher ou masquer l'image.
Voilà un exemple complet assez simple :
Le reste n'est qu'affaire de CSS.
C'est une « mauvaise méthode » car elle oblige à écrire du code JavaScript dans les attributs HTML, ce qui ne permet pas de bien séparer les aspects contenu et comportement de la page. Ça rend la maitenance plus difficle...
;)
P'tit coup de JavaScript. Il faut surveiller l'évènement mouseover de la balise HTML qui contient le nom de ton jeu (et mouseout pour retirer l'image quand la souris repart).
Comme d'habitude quand je commence à parler d'évènements JavaScript, j'aime bien dire qu'il y a une mauvaise et une bonne méthode. Cependant, j'imagine que tu es débutant en JavaScript alors je commence par te conseiller la mauvaise méthode car elle est plus facile ;)
Il faut rajouter les attributs onmouseover et onmouseout à la balise HTML de ton texte. Ces attributs doivent contenir du code JS qui va afficher ou masquer l'image.
Voilà un exemple complet assez simple :
<h1 onmouseover="afficheImage()"
onmouseout="masqueImage()">Truc bidule</h1>
<img id="truc-bidule"
alt="truc bidule" src="url_bidon/image.jpg"
width="100" height="100"
style="display: none" />
<script>
var trucBidule = document.getElementById('truc-bidule');
function afficheImage() {
trucBidule.style.display = 'block'; // ou 'inline'
};
function masqueImage() {
trucBidule.style.display = 'none';
};
</script>
Le reste n'est qu'affaire de CSS.
C'est une « mauvaise méthode » car elle oblige à écrire du code JavaScript dans les attributs HTML, ce qui ne permet pas de bien séparer les aspects contenu et comportement de la page. Ça rend la maitenance plus difficle...
;)