width - Flexslider 滑动宽度问题

Question

我在使用 flexslider 时遇到了一个奇怪的问题。幻灯片 LI 没有获得正确的宽度，因此显示了所有幻灯片。这仅发生在第一页加载时。一旦我切换到另一个选项卡并切换回来，一切看起来都很好。也许是 JS 加载问题？!

截图:here

flexslider.css

.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {text-align: center; display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides li.flex-active-slide img {text-align:center; width: auto; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; border-radius: 6px; box-shadow: 0 1px 4px rgba(0,0,0,.2); -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 4px rgba(0,0,0,.2); -o-box-shadow: 0 1px 4px rgba(0,0,0,.2); }

JS

$(window).load(function() {
    $('.flexslider').flexslider({
        controlNav: true,
        directionNav: true
    }); 
});

我也用 $(document).ready(function() 试过了，但仍然是同样的问题。

有任何想法吗？

Answer 1

嗯，维尔纳。

我最终得到了你的解决方案。很遗憾。

否则，这是另一种方法。

/* SLIDERS in content */
$('.flexslider').flexslider({
    animation: "slide", 
    start: function(slider){
        $('.flexslider').resize();
    }
});

我选择不使用上述代码的原因是，当幻灯片更新到正确的宽度时，会出现延迟并出现一点跳跃。

如果有人有更清洁的解决方案 - 请告诉我。我正在使用最新的 flexslider - 这个问题似乎只是有时会发生。但是当它发生时......啊啊。