Question

当用户将鼠标悬停在包含div上时，我试图切换两个按钮的不透明度，当它们鼠标移出时，它应该回到被隐藏状态，此时它正在这样做但是一旦我尝试点击一个按钮，它发疯并开始反复打开和关闭不透明度，这是我的代码，

的Javascript / jQuery的：

    $('#container').live({
      mouseover: function() {
          $('.button').fadeToggle();
      },
      mouseout: function() {
          $('.button').fadeToggle();
      }
    });

HTML：

            <div id="container">
                <div class="button"></div>
                <div></div>
                <div class="button"></div>
            </div>

提前Thanx！

PS：对标题感到抱歉，我忘了改变它，因为它显示并隐藏了具有淡入淡出效果的按钮而没有切换不透明度。

Answer 1

mouseover和mouseout事件泡沫，意味着它们也将触发所有元素的子项。

您应该处理不会冒泡的mouseenter和mouseleave。

Answer 2

.stop（）再次运行之前的动画。

$('#container').live({
  mouseover: function() {
      $('.button').stop();
      $('.button').fadeToggle();
  },
  mouseout: function() {
      $('.button').stop();
      $('.button').fadeToggle();
  }
});

jQuery切换按钮不透明度

2 个答案: