/ / changer la visibilité avec onmouseover / onmouseout - javascript, html, css, onmouseout

changer la visibilité avec onmouseover / onmouseout - javascript, html, css, onmouseout

J'essaie de faire disparaître un img avec un événement onmouseover, puis j'aimerais que cet img réapparaisse avec un événement onmouseout. Voici ce que j'ai à ce jour:

<body>
<h1>Catch the Easter Bunny to get your egg!</h1>
<img src="/images/images/rabbit.png" id="rabbit1" onmouseover=""
onmouseout="show(this);" alt="Catch the rabbit"/>
<img src="/images/images/rabbit.png" id="rabbit2" onmouseover="hide(this);"
onmouseout="show(this);" alt="Catch the rabbit"/>
<img src="/images/images/rabbit.png" id="rabbit3" onmouseover="hide(this)" alt="Catch the rabbit"/>
<img src="/images/images/rabbit.png" id="rabbit4" onmouseover="hide(this)" alt="Catch the rabbit"/>
<h2 id="noeggs">No Easter Eggs for You</h2>
<h2 id="yousuck">Humans suck!!!</h2>
</body>

var count = 0;

function hide(node) {
count += 1;
node.style.visibility = "hidden";
}

function show(node) {
node.style.visibility = "visible";
}

Réponses:

0 pour la réponse № 1

essayez d'utiliser l'opacité

node.style.opacity=0;

ou

node.style.display="none";

0 pour la réponse № 2

Comment vous attendez-vous à ce que cela fonctionne? Quand tu caches un élément, onmouseout l'événement se déclenchera immédiatement après avoir déplacé la souriscurseur en quelque sorte, et l'élément réapparaîtra. Cela fera clignoter pendant que le curseur bouge. Ce n'est évidemment pas ce que vous voulez. Vous devez modifier l'opacité au lieu de masquer complètement les éléments.

Et vous devriez bien obtenir l’élément cible: voir Écouteurs d'événements inter-navigateurs.