Flexslider 多幻灯片功能
有谁知道我怎样才能做到这一点： 我引用的是 flexslider 插件，您可以在此处查看： http://flex.madebymufffin.com/
3 Flexslider容器 -
$(window).load(function () {
$('#primary-slider').flexslider({
animation: 'slide',
controlNav: false
});
$('#secondary-slider').flexslider({
animation: 'slide',
slideDirection: "vertical",
controlNav: false,
directionNav: false
});
$('#tertiary-slider').flexslider({
animation: 'slide',
controlNav: false,
directionNav: false
});
});
每个容器包含 3 个图像，总共 9 个不同的图像：[1a.jpg, 1b.jpg, 1c.jpg], [2a.jpg, 2b.jpg, 2c.jpg], [3a.jpg、3b.jpg、3c.jpg]。
初始化时，它们全部同步，非常完美。
我希望有人能够解决的挑战是，如果您在任何容器上单击/滑动下一个或上一个图像，图像应该以相同的方式在其他 2 个容器上移动。因此，如果您在容器 1 上并从 1a.jpg 滑动到 2a.jpg，那么在容器 2 和 3 中也会发生同样的情况...从 2a.jpg 滑动到 2b.jpg，并分别针对第三个容器。同样，在任何容器上向后移动应该会对其他 2 个容器产生相同的效果。我想我想得太多了，有一双新眼睛的人会确切地知道该怎么做......
非常感谢任何帮助！
乔诺
Does anyone know how I can accomplish this:
I am referencing the flexslider plugin which you can view here: http://flex.madebymufffin.com/
3 Flexslider containers -
$(window).load(function () {
$('#primary-slider').flexslider({
animation: 'slide',
controlNav: false
});
$('#secondary-slider').flexslider({
animation: 'slide',
slideDirection: "vertical",
controlNav: false,
directionNav: false
});
$('#tertiary-slider').flexslider({
animation: 'slide',
controlNav: false,
directionNav: false
});
});
They each contain 3 images, total of 9 different images: [1a.jpg, 1b.jpg, 1c.jpg], [2a.jpg, 2b.jpg, 2c.jpg], [3a.jpg, 3b.jpg, 3c.jpg].
On initialization they are all synced up and it's perfect.
The challenge, which I am hoping someone can figure out, is if you click / swipe next or previous image on any of the containers, the images should move in the same manner on the other 2 containers. So if you are on container 1 and swipe from 1a.jpg to 2a.jpg, in containers 2 and 3 the same should happen...going from 2a.jpg to 2b.jpg, and respectively for the 3rd container. Likewise, going backwards on any of the containers should echo the same effect on the other 2 containers. I think I am overthinking this and someone with a fresh set of eyes will know exactly what to do...
Any help is much appreciated!
Jono
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
我认为现在可以使用 Flexslider 2 使用
sync属性来完成此操作。I think this can now be accomplished with Flexslider 2 using the
syncproperty.