jquery-ui - Jquery ui 抖动效果不断触发

Question

奇怪的问题。

像这样使用 jquery ui 效果:

<a href="in" style="position:absolute;" ><img src="images/img.png" id="perlabot"  ></a>
$('#perlabot').on('mouseenter', function () {
     $(this).effect("shake", { times:2, distance: 3}, 120);
});

它可以工作，但在 IE 和 Firefox 上，即使鼠标正好在图像中间，图像也会一直抖动。似乎移动图像一直在触发 mouseenter 事件？
无法解决这个奇怪的问题。在 chrome 上它只触发一次。

Answer 1

我没有找到解决您问题的真正解决方案，但是您可以通过检查变量是否具有特定值并在用户离开该区域时重置它来轻松避免它。

var active = false;
$('#perlabot').on('mouseenter', function () {
    if (active === false) {
        active = true;
        $(this).effect("shake", {
            times: 2,
            distance: 3
        }, 120);
    }
}).mouseleave(function () {
    active = false;
});

可能不是解决它的最聪明的方法，但它在我测试过的每个浏览器中都能正常工作(Firefox、Chrome、Opera、IE 10 和 9)

jsfiddle