javascript - 使用 onmouseover/onmouseout 更改可见性

我正在尝试通过 onmouseover 事件使 img 消失，然后我希望该 img 通过 onmouseout 事件重新出现这是我目前所拥有的:

<body>
    <h1>Catch the Easter Bunny to get your egg!</h1>
    <img src="images/rabbit.png" id="rabbit1" onmouseover=""
         onmouseout="show(this);" alt="Catch the rabbit"/>
    <img src="images/rabbit.png" id="rabbit2" onmouseover="hide(this);"
         onmouseout="show(this);" alt="Catch the rabbit"/>
    <img src="images/rabbit.png" id="rabbit3" onmouseover="hide(this)" alt="Catch the rabbit"/>
    <img src="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';
}

最佳答案

尝试使用不透明度