Как избавиться от анимации при загрузке страницы?

Question

[Евгений Низамиев]

Появилась проблема, если открыть страницу, то почему-то происходит анимация у всех элементов, у которых указан transition. Как избавиться от неё? в чем может быть причина?

Answer 1

[Anton Kalashnikov]

Думаю стоит убрать transition. Ведь это свойство и отвечает за переход между двумя состояниями.

Comments

[Евгений Низамиев]

мне оно нужно для анимации сайдбара.

главное до этого ни разу такого не было

[Anton Kalashnikov]

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

Answer 2

[joker8999]

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

Comments

[Евгений Низамиев]

всё-равно так-же(

Answer 3

[Ribwort]

Заметил, что проблема имеет место при добавлении любого скрипта на страницу. Если скриптов нет, переходы не создают проблем при загрузке. Для себя использую решение основанное на https://css-tricks.com/transitions-only-after-page...:

Для body добавлен класс отключающий все переходы

.preload * {
  transition: none !important;
}

А в js добавлен код удаляющий данный класс.

Comments

[lapard1n]

Черт! Ты мега-хорош! Это реально работает! Спасибо! Решение и простое, и рабочее!