» »

Красивый эффект появления страницы сайта

Красивый эффект появления страницы сайта

Здесь создает красивый и анимационный эффект при загрузки страниц на сайте. Что при переходе изменится структура и станет более плавным. Главное, что все создано на чистых стилях CSS и не нужно подключать JavaScript. Что анимация будет происходить только на одном файле, что подключим его на страницы.

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

Рассмотрим класс на различные эффекты анимации.

1. fadeIn - Будет отвечать за эффект появления страницы.
2. fadeInLeft - Отвечает за появление с левой стороны.
3. fadeInRight - Этот класс будет отвечать с правой стороны.
4. fadeInDown - Эффект что отвечает за вверх сайта.
5. fadeInUp - Если нужно, чтоб с низ сайта появлялся.
6. flipInX - Эффект X
7. flipInY - Эффект Y
8. fadeDistortion - Можно сделать эффект на покачивание страницы.
9. zoomIn - А этот знакомый многим эффект увеличение.

Приступаем к установке, нужно выбрать страницу, где будет производиться анимация и там находим там bоdy и заменяем на на следующее.

Код
<body class="fadeIn">

Ставим данный код перед /hеаd

Код
<link rel='stylesheet' id='custom-style-css' href='http://zornet.ru/Aben/ABGEA/FT/rynud/animations.css' type='text/css' media='all' />

На этом вся установка завершилась.

Источник: simbyone.com
27.08.2017 Просмотров: 606 Комментарий: (6)

Поделиться в социальных сетях

Материал разместил

Комментарий: 6
Slavik
Slavik 27.08.2017 14:091
0
Классно, жаль что демо нету 07a
Kosten
Kosten 27.08.2017 17:102
0
Slavik, установка не сложная, что можно поставить и проверить.
-SAM-
-SAM- 29.08.2017 01:525
+1
Есть демо, как и материал был взят с 7uarts, а указанный источник - это уже как первоисточник, откуда там брали.
Kosten
Kosten 29.08.2017 01:566
-1
Но с начало посмотрите на этом сайте, там источник указан.

Источник
Материал был взят с другого сайта
Critic©
Critic© 27.08.2017 22:143
-1
Не понимаю что за эффект здесь будет, думал на источнике есть. Может кто поставил то напишите и как видно его можно еще переделывать. Видел один эффект это появление страницы и где нет не какой гифки а как будто проявляется.
Kosten
Kosten 27.08.2017 22:304
-1
Точно не могу сказать, но на источнике на одной странице мне показалось, что там по другому страница загружается, но точно не знаю страницу и эффект был на появление, как будто раскрывается, точно сказать не могу, какой здесь эффект, так как с проверенного сайта брал и на тестовом не проверил.
avatar