如何爲Foundation的Orbit圖像滑塊預加載圖像？

Question

使用Zurb's Foundation 4.1.5（最新版本），Orbit image slider的效果很好。不幸的是，它看起來真的在頭幾秒鐘所有的圖像顯示爲一個巨大的項目符號列表。然後JavaScript開始，這一切都很美麗。

我該如何避免最初的醜陋？我可以預先加載圖像嗎？我可以在display: none或visibility: hidden之前完成所有任務嗎？

Answer 1

每Foundation documentation

我們清潔了軌道加入了包裝功能 該停止的無樣式內容的醜陋閃光燈如何初始化。下面是需要的標記 ：

要增加預加載，只是包括一個div類= 「預加載」 右 包裝裏面，像這樣：

<div class="slideshow-wrapper"> 
     <div class="preloader"></div> 
     <ul data-orbit> 
     <!-- Orbit slides --> 
     </ul> 
    </div> 

更新測試：測試與 Foundation 4.2.1http://foundation.zurb.com/download.php

使用提琴手來調節下載速度http://fiddler2.com/