Flexslider无限循环

Question

需要修复主页滑块，以便它不会在结束时飞回所有幻灯片。需要是一个无缝的循环。但我不知道我做错了什么。示例：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>

Answer 1

将animationLoop设置为true，而不是false

Answer 2

我刚刚也有过同样的辩论。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很好地解释了这一点。