javascript - 使用 SHAKE 效果时消失的元素

Question

我正在尝试弄清楚这个框架，但我在实现震动效果时遇到问题。每次我将鼠标悬停在元素上时，其他 div 就会消失。在 fiddle 中，我尝试了不同的 JQuery 和 JQuery ui，它可以工作，但选择最新的只会破坏整个事情。有小费吗？谢谢!

https://jsfiddle.net/w11qknc4/

$( ".box" ).mouseenter(function() {
$( this ).effect( "shake", { direction: "up", times: 4, distance: 10}, 1000 );
$( this ).finish().effect( "shake", { direction: "up", times: 4, distance: 2}, 1000 );
});

Answer 1

此行不是必需的，它会导致您的问题:

$( this ).finish().effect( "shake", { direction: "up", times: 4, distance: 2}, 1000 );

只需使用:

$( ".box" ).mouseover(function() {
  $(this).effect( "shake", { direction: "up", times: 4, distance: 2}, 1000 );
});

<小时/>

如果您希望在另一个效果结束之前等待一个效果结束，请参阅使用:

var start = true,
    delay = 1000;

$(".box").mouseover(function() {
  if (start) {
    start = false;
    $(this).effect("shake", { direction: "up", times: 4, distance: 2}, delay);

    setTimeout(function () {
      start = true;
    }, delay)
  }
});