6

私は次のウェブサイトを持っています：

http://cassidoo.public.iastate.edu/

メニューに JQuery UI タブを使用しています。ページをロードすると、タブ内のコンテンツが一瞬表示されます。

ui-tabs-hideトリックから Javascript での非表示まで、あらゆることを試しました。私が見逃しているトリックはありますか？私は何をすべきか？

ご協力ありがとうございました！

4

1 に答える 1

9

私は同様の状況に遭遇し、問題に対処した方法は次のとおりです。

(1.) 「hide」という CSS クラスを定義し、「display:none」に設定します。

(2.) クラス「contentpanel」の各 div で、マークアップのすぐ隣に「hide」を追加します。
これにより、javascript がページを処理するのを待つのではなく、ページが表示なしで読み込まれるようになります。

(3.) jquery.ui.tabs セレクターを作成するときは、「tabscreate」メソッドを使用して、コンテンツ パネルからクラス「hide」を削除します。したがって、セレクターは次のようになります。

  //define tabs instance 
   $( "#tabs" ).tabs({

        create: function( event, ui ) {
           //when tabs are created, remove your class .hide from each content panel
           //so jquery tabs will control when panel content will surface
           $(your contentpanel selector).removeClass(hide);
        }
     //whatever else you need to do
     ....
     ...
     ..
    });

jQuery UI タブの内部メソッドの詳細については、次をお読みください。

http://api.jqueryui.com/tabs/

そして読む

create( イベント, ui )

お役に立てれば。

クリス

于 2013-01-07T04:04:56.853 に答える