Topic: Плавное появление контента/страницы на 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+ */
}