使用jQuery循环同步多个滑块

我在一个项目中使用jQuery循环。你可以看到我的剧本

基本上，有三个不同的滑块绑定到相同的方向控制。我希望他们的转换是同步的

目前，由于这里有三个单独的滑块实例，它们开始是同步的，但最终会失去同步-如果您离开浏览器窗口或其他地方，有时会立即失去同步。这会导致序列出现混乱，通常看起来不对劲。我希望所有的滑块都能同时启动，最好链接到

.sliderImages

幻灯片

我曾尝试创建一个包含其他两个滑块的函数，并将其放入

.sliderImages

滑块上的

before

选项中，但这使它变得非常不稳定，而且我不了解足够的JS来进行故障排除

如往常一样，我们非常感谢您的帮助

---

谢谢

所以在我的头撞到墙上一段时间后，我无意中发现了。它比Cycle或我尝试过的任何其他幻灯片放映插件（即使它需要jQuery UI）都要轻得多（很多，很多），它有很好的文档记录，并且比较容易访问并按照您的意愿工作

有一个例子，他帮助我让代码正常工作，还有一个例子

当然，如果有人对改进我的代码提出建议，我愿意接受。但是这个插件是非常简单和多功能的

---

也许是一个比我更有天赋的程序员，可以让它更方便移动，比如…

所以在我的头撞到墙上一段时间后，我偶然发现了。它比Cycle或我尝试过的任何其他幻灯片放映插件（即使它需要jQuery UI）都要轻得多（很多，很多），它有很好的文档记录，并且比较容易访问并按照您的意愿工作

有一个例子，他帮助我让代码正常工作，还有一个例子

当然，如果有人对改进我的代码提出建议，我愿意接受。但是这个插件是非常简单和多功能的

也许是一个比我更有天赋的程序员，可以使它对手机友好，比如…

如果你使用（窗口）。加载函数来加载jquery循环，并使用两个具有相同选项的不同选择器，那么你应该可以使两个滑块完全同步

我假设，如果您将它们作为两个独立的init加载，并且如果您将它们加载到ready上，那么计时就会停止

无论如何，它对我来说是有效的。

如果您使用（window.load）函数来加载jquery循环，并使用两个具有相同选项的不同选择器，那么您应该可以获得两个完全同步的滑块

我假设，如果您将它们作为两个独立的init加载，并且如果您将它们加载到ready上，那么计时就会停止

---

不管怎样，它对我来说是有效的。

将它们全部设置为

timeout:0

并添加

setInterval（$（'.slides'）。cycle（'next'）”，3000）似乎会同步动画，但会干扰上一张/下一张幻灯片的导航。。幻灯片正确同步，节目暂停悬停；但是，当鼠标离开
.hero
区域时，出现了一些问题。与其简单地恢复幻灯片放映，还不如每隔一张幻灯片或沿着这些路线的其他东西的速度加倍。我肯定我只是在某种程度上误解了javascript的SetInterval功能；谢谢你的帮助。但无法使其工作。将它们全部设置为
timeout:0
并添加
setInterval（$（'.slides'）。cycle（'next'）”，3000）似乎会同步动画，但会干扰上一张/下一张幻灯片的导航。。幻灯片正确同步，节目暂停悬停；但是，当鼠标离开
.hero
区域时，出现了一些问题。与其简单地恢复幻灯片放映，还不如每隔一张幻灯片或沿着这些路线的其他东西的速度加倍。我肯定我只是在某种程度上误解了javascript的SetInterval功能；谢谢你的帮助。但它无法工作。我构建这个已经有一段时间了，但正如我所记得的，我尝试在同一个init上使用两个不同的选择器，最终它们会失去同步。此外，我还尝试为每个滑块使用不同的转换，这使得使用单个init对我来说更加困难（虽然我不是JS专家，所以可能有一个简单的解决方案）。还应该注意的是，最新版本的FlexSlider现在提供了类似的播放/暂停挂钩，因此可以使用setTimeout同步两个（或更多）还有具有不同过渡的滑块。当我建立这个网站时，FlexSlider在这方面相当有限。（虽然您仍然无法创建自己的转换…）我构建此功能已经有一段时间了，但我记得，我曾尝试在同一个init上使用两个不同的选择器，但它们最终会失去同步。此外，我还尝试为每个滑块使用不同的转换，这使得使用单个init对我来说更加困难（虽然我不是JS专家，所以可能有一个简单的解决方案）。还应该注意的是，最新版本的FlexSlider现在提供了类似的播放/暂停挂钩，因此可以使用setTimeout同步两个（或更多）还有具有不同过渡的滑块。当我建立这个网站时，FlexSlider在这方面相当有限。（尽管您仍然无法创建自己的转换…）