jCarouselが初期化される前に間違った書式設定を防止する

Question

jCarouselをアプリケーションで使用し始めたばかりで、奇妙なUI動作が発生しています。ページがレンダリングされる前の1秒間に、コンテンツを構成するすべてのLIがページ上に展開されて表示されます。一度jQuery（ "＃カルーセル名"）。jcarousel（）;しかし、ページは元気になるはずです。

私たちのアプリでこれを見ている理由の例はありませんが、私たちのコンテンツはjCarouselサイトの例よりはるかに複雑で、ブラウザがレンダリングするのに時間がかかりますHTML。

スタックオーバーフローの他の箇所では、jCarouselが適切な幅を特定できないため、各liのdivを隠すと正しく動作しないように見えます。

jCarouselにカルーセル項目を動的に読み込ませるように頭を悩ませる前に、他の誰かがこの問題を抱えているかどうか、さらに簡単な解決法があるかどうかを確認したいと思います。

Answer 1

私は、ページの下部に隠れたLIの中にカルーセルのコンテンツを読み込むことでこれを修正しました。ページのロードが、私はitemLoadCallbackがセットされたカルーセルを初期化する場合：itemLoadCallback機能で

itemLoadCallback: {onBeforeAnimation: switchHiddenCarouselParts} 

を、私はカルーセルに各隠されたペインを追加します。

carouselLoaded = false; 
function switchHiddenCarouselParts(carousel, state) { 
    if (!carouselLoaded) { 
     panes = ["pane1", "pane2"]; 

     for (i = 0; i < panes.length; i++) { 
     hidden = $("#"+panes[i]); 
     carousel.add((i+1), hidden.html()); 
     hidden.remove(); 
     $("#"+panes[i]).show(); 
     } 
     carouselLoaded = true; 
    } 
}