Jquery循环插件在同一页面中的多个寻呼机

Question

我在同一页面中遇到循环插件多个寻呼机的问题 我想在同一页面中显示 24 周期插件。每个插件都包含一些图片和信息。所以我想用“寻呼机”互相控制。一切正常，所有插件都可以使用简单的文档准备功能。但是我对寻呼机有一个完全不同的问题。

当我尝试在插件函数中添加pager:"#nav" 和.before("<div id="nav"></div>") 时。该脚本会创建一个像 <div id="nav"></div> 这样的容器，然后插件会将所有寻呼机链接附加到该容器中。因此，所有寻呼机链接都显示在它导致的一个容器 id 中。

http://onur.mayanet.com.tr/test

我想访问每个插件都应该与自己的寻呼机一起使用的东西。

Answer 1

页面中的 ID 必须是唯一的，因此请更改：

$('.slideshow').before('<div id="nav"></div>').cycle({
    fx: 'scrollLeft',
    speed: 'fast',
    timeout: 350,
    pager: "#nav"
});

到这里：

$('.slideshow').each(function() {
  $(this).before('<div class="nav"></div>').cycle({
    fx: 'scrollLeft',
    speed: 'fast',
    timeout: 350,
    pager: $(this).prev()
  });
});

You can test it out here，我们在这里所做的只是循环并为每个人创建/分配一个寻呼机，而不是使用必须唯一的id。请务必将 #nav CSS 规则更改为 .nav 以匹配 id => class 更改。