Question

我有一个简单的图像滑块，可以在悬停时循环显示多个图像。问题是它非常不稳定。原因是，这是一个在悬停状态之前可见并在悬停时隐藏的静态图像。这使得图像周期不连贯。我只是想找到一种平滑循环的方法。

或者我只需要找到一种方法让静态图像在悬停时消失，并在鼠标离开div / image时重新出现。

我在下面有一个演示

jQuery代码

jQuery(function($){

// Cycle plugin
$('.slides').cycle({
    fx:     'none',
    speed:   1000,
    timeout: 70
}).cycle("pause");

// Pause & play on hover
$('.slideshow-block').hover(function(){
    $(this).find('.slides').addClass('active').cycle('resume');
}, function(){
    $(this).find('.slides').removeClass('active').cycle('pause');
});

});

静态图像位于css

的第20行

Answer 1

做得好你所说的，在悬停时隐藏图像然后再显示图像似乎可以解决问题。

jQuery(function($){

// Cycle plugin
$('.slides').cycle({
    fx:     'none',
    speed:   1000,
    timeout: 70
}).cycle("pause");

// Pause & play on hover
  $('.slideshow-block').hover(function(){
      $(this).find('.link').hide();
    $(this).find('.slides').addClass('active').cycle('resume');
  }, function(){
      $(this).find('.link').show();
      $(this).find('.slides').removeClass('active').cycle('pause');
  });

});

http://jsfiddle.net/WCTX8/2/

平滑jQuery幻灯片

1 个答案: