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

Simple Mouseover not Working in Chrome?

本文关键字：Chrome 不起作用 悬停 鼠标 简单      更新时间：2023-09-26

好的，所以我正在研究一个游戏中心。 我有这个很酷的想法，所以当我将鼠标悬停在超链接上时，它会显示一张可怕的脸（仅用于 kickz 和 gigglez）;

问题是，它在火狐中完美运行，但谷歌浏览器却不能？ 演示到这里结束：

http://bouncygames.org/games/scary/

请帮忙... :(

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

你不需要任何javascript，只需使用这个css声明，它将在所有浏览器中完美运行：

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

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

不要使用 onmouseover 和 onmouseout 这些被认为是不良的编码实践，原因有几个。
此外，不要使用 center 标记，而应改用 css 声明text-align:center。

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

img.style.display="none";

和

img.style.display="block";

请确保同时从 img 标记中删除 visibility='hidden' 属性，否则它将不起作用

getElementById 和 （'img'） 之间有一个空格，请将其删除并重试。

相关文章：