javascript - 幻灯片:最后一张图片闪烁页面长度？

Question

我们的 flexslider 上最后一张图片的一小部分在幻灯片加载后立即闪烁整个页面。第一个图像设置为可见，所有其他图像设置为隐藏。插件设置为在页面加载后运行。我认为可能是页面上的其他原因导致了此问题，但如果我禁用页面上除 slider 之外的所有静态 block ，它仍然会闪烁。所以我应该因此断定它一定是 slider ？这是在我们的暂存站点上发生的一个例子。只需继续点击刷新即可查看 - http://www.shopcandelabra.com/

<script type="text/javascript">
$j(window).load(function() {
   var loopCount = 0;
   $j("#carousel").flexslider({
      animation: "slide",
      slideshowSpeed: 2000,
   start: function(slider){
        $('body').removeClass('loading');
    },
    after : function(slider){
       if(slider.currentSlide == 0 && loopCount == 1){
         slider.pause();
       }   
    },
    end : function(slider){
      loopCount++;  
      }
   });
});
</script>

.flexslider .slides>li:first-child {
    display: block;
    -webkit-backface-visibility: visible;

.flexslider .slides>li {
    display: none;
    -webkit-backface-visibility: hidden;
}
.flexslider .slides img {
    width: 100%;
    height: auto;
    display: block;
}

Answer 1

将 float: left 添加到您的 li 元素。

body.cms-home .main-container #candelabra-carousel.flexslider .slides>li {
  float: left;
}

导致:

修复后: