Замедляет ли переход CSS3 сайт? - PullRequest
Новая
       16

Замедляет ли переход CSS3 сайт?

3 голосов
/ 01 марта 2012

В настоящее время я добавил CSS3 переход на свой веб-сайт.Я не уверен, если это возможно, что это замедляет мой сайт, но все, кажется, мерцает и есть это "резкое поведение" на переходах и флэш-видео.

Я использую Mozilla Firefox 10.0.02.

Я добавил следующее в свою таблицу стилей CSS: 

*:link, *:visited, *:hover, *:active, *:focus {
    -webkit-transition: color .25s linear, background-color .25s linear, border-color .25s linear;
    -o-transition: color .25s linear, background-color .25s linear, border-color .25s linear;
    -moz-transition: color .25s linear, background-color .25s linear, border-color .25s linear;
    transition: color .25s linear, background-color .25s linear, border-color .25s linear;
}

Можете ли вы сказать мне, скорее это мой браузер работает медленно или это CSS, который я добавил, и если, то каковы доказательства?

Спасибо!

Ответы [ 2 ]

9 голосов
/ 01 марта 2012

Это потому, что вы добавили переходы ко всем в этих состояниях.

Я бы изменил: 

*:link, *:visited, *:hover, *:active, *:focus {

до 

a:link, a:visited, a:hover, a:active, a:focus, [...Other elements...] {

Так что это более нацелено. В противном случае, когда вы перемещаете мышь, запускается состояние наведения, в результате чего браузеру приходится проверять переход.

1 голос
/ 01 марта 2012

Любая анимация добавит нагрузку на графические системы, но если вы комбинируете CSS-переходы и плагины, такие как Flash, вы ухудшите нагрузку (так как слои должны быть объединены). Ваш режим флэш-памяти установлен на прозрачный? если это так, попробуйте использовать opaque, так как это не позволит анимации флэш-памяти заботиться о том, что происходит внизу (технически говоря, это становится наложением в видеодрайвере).

...