javascript - jQuery FadeIn / FadeOut 方法不起作用

Question

我想在悬停时淡化图像。为什么这不起作用？

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
  $(document).ready(function(){
    $("#lightbulb").hover(function(){
      $("#lightbulb").fadeOut('fast');
    },function(){
      $("#lightbulb").fadeIn();
    });
  });
</script>

其他 jQuery 方法（如 CSS 样式和更改图像源）正在运行。

标签： javascriptjqueryhtmlcssanimation

Answer 1

如果可行，您可以使用 css 而不是 jQuery。当您淡出元素时，将触发悬停退出事件，因此它只会按照您拥有的方式在状态之间切换。这是一个在悬停时隐藏/显示的示例。基本上你喜欢

#elem {
     opacity: 1;
     transition: opacity: 0.2s;
}

#elem:hover {
    opacity: 0;
}

在您要隐藏的任何元素上。