bxslider有时会在页面刷新时从未在初始加载时正确显示

Question

滑块在第一次加载时无法正确加载。随机时间它会在第一次加载时正常工作，但有时则不能。只有子弹出现在页面上的错误位置。当你重新加载时，一切都正确地卡入到位。我也注意到其他网站我有时不正确地加载CSS加载，直到重新加载页面。有谁知道我做错了什么？

以下是代码：

<script type="text/javascript">

    $(document).ready(function(){
  $('.bxslider').bxSlider({
      auto: true,
      autoStart:true,
      captions:true,
      preloadImages: 'none'
      });

    });

</script>



<div style="float:left !important" ><ul class="bxslider">
  <li><a href="http://templesschoolofkarate.com/contact.php"><img alt="Sign up today for two free classes" src= "http://templesschoolofkarate.com/res/slide/slide1.jpg"  /></a></li>
  <li><a href="http://templesschoolofkarate.com/programs.php"><img alt="we are rate #1" src="http://templesschoolofkarate.com/res/slide/slide2.jpg"  /></a></li>
  <li><a href="http://templesschoolofkarate.com/programs-weapons.php"><img alt="ask about our weapons program" src="http://templesschoolofkarate.com/res/slide/slide3.jpg"  /></a></li>
  <li><a href="http://templesschoolofkarate.com/programs-kids.php"><img alt="kids learn more than just kicking and punching" src="http://templesschoolofkarate.com/res/slide/slide4.jpg" /></a></li>
</ul>
</div>

链接到网站http://templesschoolofkarate.com

Answer 1

我一直在遇到同样的问题，我想我已经找到了效果 - 如下所示，包装元素有时会将自己设置为0px的高度。

不是100％肯定，但对我来说，我认为这是翻译中期过渡的页面。我没有明确设置startSlide，即使它在文档中说默认值为0，也没有工作。

我在初始化时已包含startSlide:0，这似乎解决了我的问题。