jquery - 循环幻灯片：仅自动显示一些指定的幻灯片

Question

我正在为我的幻灯片使用 Cycle 插件：http: //jquery.malsup.com/cycle/

幻灯片自动启动，并使用通过悬停触发的导航。

我希望幻灯片仅在指定的幻灯片中滑动，并且仅在它们悬停在导航中时才显示其他幻灯片。

我希望有人能理解。

编辑：我制作了一张图片。也许这更清楚地说明了我试图实现的目标。 http://www.vrds.nl/foto/slide_example.jpg

Answer 1

首先，这里有一个版本 2 的循环插件 ( https://github.com/malsup/cycle2 )

API：http: //jquery.malsup.com/cycle2/api/

为了做到这一点，你只需要挂钩循环后事件，当幻灯片在第三个时暂停幻灯片放映。

$( '#mySlideshow' ).on( 'cycle-after', function( event, opts ) {
   if (opts.currSlide==2) $('#mySlideshow').cycle('pause');  // pause on 3rd one
});

对于悬停，您可以将事件附加到它们。假设正确的部分是li元素（它们可以是在这里做出假设的任何东西）：

$('li').mouseover(function() {
   $('#mySlideshow').cycle('goto', $(this).index());  // something like this;
});

如果您不想使用插件的第二个最新版本，则逻辑完全相同。