停止列表动画悬停

Question

我们在这里做动画：

Animation list

function run() { 
    //jQuery("li").click(function() { 
    var prev = jQuery("#rotated li:first-child"); 
    jQuery.unique(prev).each(function (i) { 
     jQuery(this).delay(i * 600).slideUp(function() { 
      jQuery(this).appendTo(this.parentNode).slideDown(); 
     }); 
    }); 
    //}); 
    jQuery('#rotated li:first-child').hover(function() { 
     jQuery(this).pause(true,true).slideUp 
    }) 
} 
window.setInterval(run, 3000); 

我们只需要停止动画当用户将鼠标悬停“#rotated”的元素。

感谢您的帮助。

Answer 1

您可以我们可以使用clearInterval（）

var intVal = window.setInterval(run,3000); 

$('#rotated').on('mouseenter',function(){ 
clearInterval(intVal); 
}); 

DEMO

如果你想让它继续旋转，当鼠标离开为此

$('#rotated').on('mouseenter', function() { 
    clearInterval(intVal); 
}).on('mouseleave', function() { 
    intVal = window.setInterval(run, 3000); 
}); 

DEMO