FlexSlider循环问题

Question

我对flexSlider2不定式循环动画有问题。我试着制作垂直旋转木马，有三个可见的项目：

​

​

问题是当旋转木马到达最后或第一个幻灯片时--首先它克隆项目，只有在滑入视图后才用正确的项目替换。是否有任何机会让它克隆正确的项目之前，它的幻灯片在视口？

我用小提琴复制了我的问题：http://jsfiddle.net/jolanta/RLk8d/3/

HTML：

<div class="left-slider-content">
    <div class="flexslider-left carousel" id="flexslider-left">
        <ul class="slides">
            <li><img src="http://s27.postimg.org/pmf1hghf3/slider_1.png?noCache=1392651530" /></li>
            <li><img src="http://s7.postimg.org/u26xzbnlz/slider_2.png?noCache=1392651562" /></li>
            <li><img src="http://s3.postimg.org/5yb8v5d4f/slider_3.png?noCache=1392651586" /></li>
            <li><img src="http://s13.postimg.org/j7zbo5k37/slider_4.png?noCache=1392651603" /></li>
            <li><img src="http://s12.postimg.org/p3rnfvc55/slider_5.png" /></li>
        </ul>
      </div>
    <div class="sw_arrows"></div>
</div>

CSS：

.left-slider-content {
    width:100px;
}
.flexslider-left .flex-viewport {
    height: 297px!important;
}
.carousel .slides {
    display: block;
    margin: 0 auto;
    width: 100%;
    position: relative;
    list-style: none;
    overflow: hidden;
}
.carousel .slides li {
    display: inline;
    padding: 0;
    list-style: none;
}

联署材料：

$('#flexslider-left').flexslider({
  animation: "slide",
  direction: "vertical",
  controlNav: false,
  animationLoop: true,
  controlsContainer: ".sw_arrows",
  slideshow: false,
  move: 1,
}); 

如果能提供任何帮助，我将不胜感激。

Answer 1

根据我的经验，您还可以查看Cycle2：http://jquery.malsup.com/cycle2/，它是迄今为止最好的jQuery旋转木马。它附带一个定义良好的API，可以与外部插件一起工作，并为各种操作提供许多不同的选项。

垂直卷轴的基本示例，摘自Cycle2的站点：

<div class="cycle-slideshow"
    data-cycle-fx="scrollVert"
    >
    <img src="http://malsup.github.io/images/p1.jpg">
    <img src="http://malsup.github.io/images/p2.jpg">
    <img src="http://malsup.github.io/images/p3.jpg">
    <img src="http://malsup.github.io/images/p4.jpg">
</div>

只要将jquery.cycle2.js添加到HEAD部分，上面的内容就可以正常工作，而无需额外的初始化。

在这里看到它的作用：http://jsfiddle.net/natnaydenova/7uXPx/