jquery - 平滑jQuery幻灯片

我有一个简单的图像滑块，可以在悬停时循环浏览多个图像。问题是它非常不连贯。原因是，这是一个静态图像，在悬停状态之前可见，并且在悬停时隐藏。这会使图像循环不连贯。我只是在寻找一种方法来消除周期。

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

我下面有一个演示

JS Fiddle Demo

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行

最佳答案

做好您说的话，将鼠标悬停时隐藏图像，然后再显示图像似乎可以解决问题。

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 - 平滑jQuery幻灯片，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19162734/