Как отключить CSS transition до завершения загрузки страницы


При верстке очередного большого проекта, на некоторых страницах CSS трансформация для структурных элементов страницы иногда начиналась еще до завершения загрузки всей страницы. Сказать честно – смотреться плохо :(

Для исправления данного дефекта можно воспользоваться методом запрета.

Добавим тегу BODY стиль:

<body id="transition_disabled">
#transition_disabled
{
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}

После того, как страница полностью загрузится – необходимо удалить запрет. Сделать это можно при помощи JS.

$("window").load(function() {
  $("body").removeAttr("id");
});

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

Обменник валют

Другие публикации:

Написать комментарий через:

 
               
  • Локальный блог
  •  
 

Ваш отзыв

Имя *

Почта (скрыта) *

Сайт

Напишите цифрами двa вoceмь двa *

Сообщение

 
Статусы для соц.сетей на ArtKiev Design Studio