7

需要修复主页滑块，使其不会在最后飞回所有幻灯片。需要无缝循环。但我不知道我做错了什么。示例：http: //3dollar.vigorbranding.com/

<script type="text/javascript">
    jQuery(window).load(function() {
        jQuery('#carousel').flexslider({
            animation: "slide",
            controlNav: false,
            animationLoop: false,
            slideshow: true,
            itemWidth: 187,
            itemMargin: 0,
            asNavFor: '#slider'
        });

        jQuery('#slider').flexslider({
            animation: "slide",
            controlNav: false,
            animationLoop: true,

            <?php if (ot_get_option('autoslide') == 'yes') { ?>

            slideshow: true,                //Boolean: Animate slider automatically
            slideshowSpeed: <?php echo ot_get_option('delay') ?>, 

            <?php } else { ?>
            slideshow: false,  
            <?php }  ?>

            sync: "#carousel",
            start: function(slider) {
                jQuery('body').removeClass('loading');
            }
        });

    });
</script>
4

2 回答 2

6

设置animationLoop为true而不是false

于 2013-04-01T15:04:48.783 回答
0

我刚刚也有同样的辩论。animationLoop: true 对我来说还不够......我在这里阅读了关于这个问题的主题：

https://github.com/woothemes/FlexSlider/issues/287

并根据此线程中的建议，我最终转换为 bxSlider：

http://bxslider.com/examples/carousel-dynamic-number-slides

这不仅完美地完成了无限循环，而且它的大小模型看起来更直观；我已经能够更轻松地将它与我的网格对齐。如果你想到：

[   item    ][mgn][   item    ][mgn][   item    ][mgn][   item    ][mgn]

（其中 mgn = 保证金）

然后在 flexslider 中，如果我调整项目宽度和边距以使滑块完全对齐：

[       page width            ]
[   item    ][mgn][   item    ][mgn][   item    ][mgn][   item    ][mgn]

然后，一旦我滚动到 RH 边缘，仍然有一个“幽灵幻灯片”潜伏在 RH 边缘，即尾随边距：

                                    [       page width            ]
[   item    ][mgn][   item    ][mgn][   item    ][mgn][   item    ][mgn]
                                                         ghost slide ^

bxSlider 完美地说明了这一点。

于 2014-07-31T14:00:40.460 回答