Question

一旦我加载或重新加载页面。我包含在html中的gif开始播放。

$('.text').mouseover(function() {
$('.hover').css("visibility", "visible"); })

$('.text').mouseout(function() {
$('.hover').css("visibility", "hidden"); });

我希望gif在我将鼠标悬停在相关元素上时开始，并在我将光标移开时停止。该JS位于HTML文档主体内的script标记中。在我第一次将鼠标悬停在'text'元素上后，它可以工作。很想知道我做错了什么。

Answer 1

在初始页面加载时，图像的可见性很可能是visible。第一次进行鼠标悬停，然后进行鼠标悬停时，它会设置为hidden，这是您的预期行为。尝试通过以下方法之一将img的可见性设置为hidden：

在页面顶部添加样式：

<html>
  <head>
    <style>
      img.hover { visibility: hidden; }
    </style>
  </head>
  <body>
   <img src='path/to/image.gif' class='hover' />
  </body>
</html>

或者，在图像本身中设置样式内联：

<html>
  <body>
   <img src='path/to/image.gif' class='hover' style='visibility: hidden' />
  </body>
</html>

我遇到一个问题，就是“ mouseover”事件只是在我甚至将鼠标悬停在所选元素上之前就开始了

1 个答案: