javascript - HTML タブがプリロードされない

Question

タブ付きコンテンツに問題があります。HTML/CSS/Javascript で作成された非常にスタイルの良いコンテンツ タブバーをダウンロードしました。

問題は、ページの読み込み中にすべてのコンテンツが一度に表示されることです。ロードが完了すると、タブに配置されます。

なぜこれを行うのか誰か知っていますか？私は JS と関係があると考えていますが、残念ながら JS については何も知りません。

必要に応じて JS コードを投稿できます。

ありがとう！

Answer 1

これは、JS が適用される前に HTML (ドキュメント) が最初に読み込まれるためです。したがって、最初はすべての HTML コンテンツが表示されます。

これを解決する 1 つの解決策は、最初に CSS を介してコンテンツを非表示にし、JS がコンテンツをタブ付きコンテンツに変換した後に表示することです。

この基本的な例は、ここにありますhttp://jsfiddle.net/86pzN/

$(function(){
    setTimeout(function(){
        $( "#tabs" ).tabs();  
        $('#tabs-2,#tabs-3').show();
    }, 3000);
});

一部のタブは css を介して非表示にすることができ、タブ機能が適用された後に表示されます。

psここにコードを追加しsetTimeoutて、JS コードを実行する前に HTML をゆっくりロードするページを模倣しました。