Przejście do CSS migocze za pomocą: odwiedzonego w Safari, Chrome i Firefox, ale nie Opera

Question

(W przeglądarkach obsługujących przejścia CSS, w tym najnowsze wersje Firefoksa, Safari i Chrome. O dziwo, ten problem nie pojawia się w Operze .)

Czy ktoś jeszcze to zauważył? Po umieszczeniu przejścia kolorowego na łączu: a: odwiedzone przechodzi do koloru łącza: przed wyświetleniem koloru: hover. Sprawdź:

http://jsfiddle.net/Mgzv9/2/

Czy ten kolor migotanie należy unikać?

Answer 1

Nigdy nie widziałem, aby tak się stało podczas używania koloru. Ale tak się dzieje, gdy używa się obrazów w baground. Jest to bcoz czasu ładowania i można tego uniknąć, wykorzystując wszystkie obrazy przejścia w jednym dużym obrazie i używając właściwości baground-position do sterowania obrazem.

Answer 2

Od pewnego czasu kręciłem się wokół tego problemu.

Chodzi o to, że problem ten jest trudny do odtworzenia.

OK, co się dzieje, czasami podczas ładowania/odświeżania strony z przejściem kolorów na linkach, kolor jest najpierw przenoszony z domyślnego koloru łącza przeglądarki do koloru zdefiniowanego przez CSS. Właściwie to nie dzieje się dla mnie, kiedy otwieram HTML z dysku, ale jeśli umieściłem go na serwerze (nawet na serwerze lokalnym), to pojawia się ten problem.

Aby odtworzyć problemu, należy utworzyć HTML, dodaj stylów i określić przejście do linków, coś takiego:

a { 
    color: red; 
    -webkit-transition: color .5s linear; 
    -moz-transition: color .5s linear; 
    -o-transition: color .5s linear; 
    -ms-transition: color .5s linear; 
    transition: color .5s linear; 
} 

a:hover { 
    color: green; 
} 

... a potem to stylów w kodzie HTML.

Umieść pliki na serwerze i spróbuj otworzyć stronę w Chrome, spróbuj odświeżyć stronę, czasami powinieneś zobaczyć przejście z domyślnego niebieskiego koloru, kiedy strony się ładują.

Po dekonstrukcji niektórych witryn, gdzie wydawało się, że nie ma z tym problemu, wymyśliłem to proste rozwiązanie.

Jeśli włączysz niektóre pliki JavaScript, to po prostu umieść Javascript zawiera PO Twój CSS zawiera.

Działa nawet, jeśli połączysz pusty plik JS po arkuszu stylów.

Mam nadzieję, że to pomoże!