javascript - 简单的鼠标悬停在 Chrome 中不起作用？

Question

好的，所以我正在开发一个游戏中心。我有了这个很酷的想法，所以当我将鼠标悬停在一个超链接上时，它会显示出一张可怕的脸（只为 kickz & gigglez）；

问题是，它在 Firefox 中完美运行，但在 Google Chrome 中却不行？演示在这里：

请帮忙... ：（

*我的问题：* *为什么这在 Chrome 中不起作用，我该如何解决？*

score 1 · Accepted Answer

您不需要任何 javascript，只需使用此 css-declaration，它将在所有浏览器中完美运行：

#img{
   display:none;
}

a:hover ~ #img{
   display:block;
}

为了使它更具体（这样它不会在所有悬停的锚上触发），将一个类放在你的锚上并写（例如.scary:hover ~ #img）。

不要使用 onmouseover 和 onmouseout 这些被认为是不好的编码实践有几个原因。
另外，不要使用center标签，而是使用 css-declaration text-align:center。

score 0 · Accepted Answer

在您的脚本中，不要使用 img.style.visibility，而是使用

img.style.display="none";

和

img.style.display="block";

确保您还从 img 标签中删除了 visibility='hidden' 属性，否则它将不起作用

getElementById 和 ('img') 之间有一个空格，删除它并重试。

2 回答 2