jQuery kartach Flash (FOUC), gdy strona ładuje

Question

Mam następującą stronę internetową:

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

używam jQuery UI Tabs dla mojego menu. Po wczytaniu strony następuje flashowanie zawartości na kartach.

Próbowałem wszystkiego, od sztuczki ui-tabs-hide do ukrywania rzeczy w JavaScript. Czy brakuje mi jakiejś sztuczki? Co powinienem zrobić?

Dziękuję za pomoc!

Answer 1

wpadłem podobnej sytuacji i oto jak ja poruszono kwestię:

(1.) określa klasę css nazwie "ukryć" i ustawić ją na "display: none"

(2.) w każdym div z klasą "contentpanel", dodaj "ukryj" tuż obok w swoim znaczniku. to zapewni, że strona ładuje się z wyświetlaczem bez oczekiwania na obsługę javascript.

(3.) Podczas tworzenia selektora jquery.ui.tabs należy użyć metody "tabsreate" w celu usunięcia klasy "hide" z paneli o treści . więc selektor będzie wyglądać mniej więcej tak:

//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 
    .... 
    ... 
    .. 
    }); 

Aby dowiedzieć się więcej o kartach jQuery UI metod wewnętrznych, przeczytaj to:

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

i czytać

tworzyć (event, ui)

Mam nadzieję, że to pomoże.

Chris