1

Тема: Плавное появление контента/страницы на CSS

Чтобы контент страницы появлялся плавно, достаточно в файл стилей добавить следующие правила:

/*плавная загрузка страниц*/
@-webkit-keyframes fade-in {   0% { opacity: 0.1; }   100% { opacity: 1; }   }
@-moz-keyframes    fade-in {   0% { opacity: 0.1; }   100% { opacity: 1; }   }
@-o-keyframes      fade-in {   0% { opacity: 0.1; }   100% { opacity: 1; }   }
@keyframes         fade-in {   0% { opacity: 0.1; }   100% { opacity: 1; }   }
 
body {
  -webkit-animation: fade-in 1s linear; /* Safari 4+ */
  -moz-animation: fade-in 1s linear; /* Fx 5+ */
  -o-animation: fade-in 1s linear; /* Opera 12+ */
  animation: fade-in 1s linear; /* IE 10+, Fx 29+ */
}

Поделиться

2

Re: Плавное появление контента/страницы на CSS

Если при загрузке страницы заметно, что контент подгружается не плавно, воспользуйтесь реализацией плавной загрузки стран цы с помощью JavaScript. Но при использовании скриптов для плавного появления контента страницы, вам следует убедиться, что эта реализация работает во всех браузерах.

Поделиться