軌道滑塊未在頁面刷新時加載？

Question

我在軌道幻燈片中遇到了問題，這是ZURB基金會的一部分。

http://visiondemo.com.au/tmp/

如果您單擊標題徽標或通過單擊鏈接登陸主頁，幻燈片放映將完美加載。 沒有問題。 但是，如果你點擊刷新，它就會丟失。

此外，當頁面刷新並且幻燈片顯示丟失時，調整窗口大小會使其神奇地出現。

任何想法我怎么能一直加載它？

干杯。

Answer 1

嗯，這個答案將是一個非常黑客的做事方式，但我認為它會以某種方式為你工作..

首先修復高度：數據軌道中的0px問題。 由於您已選擇軌道內容作為實際標題，因此請嘗試將其添加到<style>標記或style.css中。 （#note僅適用於中上方塊，為小塊提供高度）。

.slideshow.show-for-medium-up > li {
    height: 421px !important;
}

現在已經很好並且正常工作，你現在就會看到你的軌道......顯然會出現另一個問題。 它會在內容的.orbit-caption完成列表樣式之前顯示軌道。 所以將這個小修正附加到你的style.css

/* Orbit Fix */

    ul[data-orbit] {
        margin: 0;
        padding-left: 0;
        list-style-type: none;
    }

    /* initially, hide all slides... */
    ul[data-orbit] li,
    ul[data-orbit] .orbit-caption {
        display: none;
    }

    /* ...except for the first one */
    ul[data-orbit] li:first-child { display: block; }

    /* show slides once .orbit-container is loaded */
    .orbit-container ul[data-orbit] li,
    .orbit-container ul[data-orbit] .orbit-caption {
        display: block;
    }

更新：我認為這是因為你只在屏幕很小時顯示圖像，我建議添加這個，

.slideshow.show-for-small-only img { 
     /* change the img height here */ 
     height: 200px; /* Change this as you see fit */
}