Небольшая проблема с CSS3 transition при обновлении страницы. Как можно решить?

Question

[Алексей Черток]

Здравствуйте. У меня возникла проблема с CSS3 transition. Проблема в том, что когда обновляешь страницу, все те элементы к которым приписан transition: all .4s скачут на странице.

НО! Есть нюанс, правда не знаю как это возможно, но когда подключаешь jquery к странице - все эти баги со скачущими элементами пропадают.

Смотрите пример, на этой странице.
Буду очень благодарен, если поможете с этой проблемой.

Заранее спасибо! С уважением, Алексей!

Answer 1

[Graph]

а зачем all использовать, когда у вас только фон меняется, достаточно
transition: background-color 0.4s linear;

Comments

[Алексей Черток]

Спасибо. А как быть с поиском, у него эффект увеличения ширины и цвета бордера ?

[Graph]

примерно так transition: border-color,border-width 0.4s linear;

Answer 2

[Алексей Черток]

Забыл дописать, прошу прощение. Когда перейдете на ссылку, что бы увидеть такой эффект, обновляйте страницу каждый раз.

Answer 3

[Виталий Желтяков]

Вы не бойсь в хроме испытываете?

Comments

[Алексей Черток]

Именно в нем, а что ?

[Виталий Желтяков]

transition + transform в Хроме работает с багами - рывки, не правильная отрисовка