Jquery mouseout在光标仍位于元素上时触发

Question

<div id="container">
  <div class="element">Some text</div>
  <div class="element">Some other text</div>
  <div class="element">Some more text</div>
</div>

Answer 1

我认为你需要把你的mouseenter和mouseout事件拉到你的动画功能之外。每次调用animate函数时，您都在为每个元素添加另一个鼠标事件。这导致它在您鼠标退出时多次调用您的动画函数。

这里有一个小提琴，我添加了一个计数器，看看动画函数被调用了多少次。

var counter = 0;
function animate(el, dir) {
   $("#count").val(counter);
   counter++;

鼠标移出并移出几次，您可以看到每次鼠标移出时它都在复合动画调用。