2013-09-22 12 views
11

Po ustawieniu autofocus="autofocus" na elemencie wejściowym, a następnie w przeglądarce Firefox, po załadowaniu strony, wyświetla się przez ułamek sekundy bez zastosowania CSS. (Np. Treść nie jest wyśrodkowana, nagłówek renderowany czcionką domyślną itp.)HTML 5 Autofocus przejmuje ładowanie CSS

Po usunięciu autofokusa strona ładuje się prawidłowo i wyświetla się, gdy jest już gotowa.

Czy istnieje sposób na ładowanie strony normalnie przy użyciu funkcji autofocus w przeglądarce Firefox?

+4

Wydaje się to być błąd w Firefoksie: https://bugzilla.mozilla.org/show_bug.cgi?id=712130 – tw16

Odpowiedz

14

Znalazłem, że poprzez dodanie trochę kodu JavaScript w <head>, strona czeka na załadowanie stylu przed ustawieniem ostrości.

Nie jestem do końca pewien, dlaczego to działa, ale tak jest!

Przykład:

<script type="text/javascript"> 
    // Fix for Firefox autofocus CSS bug 
    // See: http://stackoverflow.com/questions/18943276/html-5-autofocus-messes-up-css-loading/18945951#18945951 
</script> 
+0

Ta poprawka działa! Wielkie dzięki. –

+0

Działa to, ponieważ blokuje przeglądarkę i wydaje się, że to krótkie blokowanie wystarcza, aby Firefox prawidłowo ułożył stronę w tle. – Fleshgrinder

+2

Wygląda na to, że błąd został naprawiony bardzo niedawno i trafi do FF 60: https://bugzilla.mozilla.org/show_bug.cgi?id=712130 – Niavlys