在悬停jquery上切换图像

Question

好吧，互联网似乎还没有解决方案。

我需要在悬停时旋转/淡入/滑动十个左右堆叠在一起的 img。以这种方式

$(function(){
$('.preview img:gt(0)').hide();
setInterval(function(){
  $('.preview :first-child').fadeOut().next('img').fadeIn().end().appendTo('.preview');}, 
  200);
});

除了我需要用悬停来踢它并停止它，这是我无法完成的。我尝试添加活动类等，但它只是在悬停开始时翻转

Answer 1

setInterval 方法返回一个句柄，您可以使用它来停止间隔：

$(function(){
  $('.preview img:gt(0)').hide();

  var handle;

  $('.preview').mouseover(function(){
    handle= setInterval(function(){
      $('.preview :first-child').fadeOut().next('img').fadeIn().end().appendTo('.preview');}, 
    200);
  });

  $('.preview').mouseout(function(){
    clearInterval(handle);
  });

});