CSS-переход мигает с: посещения в Safari, Chrome и Firefox, но не в Opera - PullRequest
5 голосов
/ 18 октября 2011

(Для браузеров, которые поддерживают переходы CSS, включая последние версии Firefox, Safari и Chrome. Странно, эта проблема не появляется в Opera.)

Кто-нибудь еще заметил это? Когда вы добавляете цветовой переход к ссылке a: a, посещения переходят к цвету ссылки a: перед отображением цвета a: hover. Проверьте это:

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

Можно ли избежать мерцания этого цвета?

Ответы [ 2 ]

1 голос
/ 05 декабря 2011

Я какое-то время ломал голову над этой проблемой.

Дело в том, что эту проблему на самом деле трудно воспроизвести.

ОК, что происходит, иногда при загрузке/ обновляя страницу с переходом цвета по ссылкам, цвет сначала переводится из цвета ссылки браузера по умолчанию в цвет, определенный CSS.На самом деле это не происходит для меня, когда я открываю HTML с диска, но если я помещаю его на сервер (даже на локальный сервер), появляется эта проблема.

Чтобы воспроизвести проблему, создайтеHTML, добавьте таблицу стилей и определите переход для ссылок, что-то вроде этого:

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;
}

... и затем включите таблицу стилей в ваш HTML.

Поместите файлы на сервер,и попробуйте открыть страницу в Chrome, попробуйте обновить сайт, иногда вы должны сначала увидеть переход от стандартного синего цвета, когда страницы загружаются.

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

Если вы тоже включите некоторые файлы Javascript, просто поместите Javascript, включающий ПОСЛЕ , в который входит ваш CSS.вы просто включаете пустой файл JS после таблицы стилей.

Надеюсь, это поможет!

0 голосов
/ 18 октября 2011

Я никогда не видел, чтобы это происходило при использовании цвета.Но да, это происходит при использовании изображений в baground. Это - время загрузки, и этого можно избежать, используя все переходные изображения в одном большом изображении и используя свойство baground-position для управления изображением.

...