Статьи об IT

Jquery библиотека для анимации скроллинга

Jquery библиотека для анимации скроллинга

И вначале реклама, небольшой блок. Прошу не сердиться и не вносить ее в фильтры блокировщиков.

подробнее о рекламодателе можно узнать внутри блока
Спасибо. А теперь сам материал.

Практически любые лэнднги содержат эффекты при прокрутке, обычно это разного-рода эффекты появления блоков. Рассмотрим как это и чем.

Здравствуйте. Практически все сайты, направленные, а точнее ориентированные, на эффектный дизайн, который привлекал бы взгляды, содержит эффекты блоков div'ov при прокрутке страницы. Все это делается какой-либо библиотекой на jquery + анимацией на css3. По сути js обрабатывает эффект скроллинга, а точнее то, что div попадает в наше поле зрения и задействует уже transition анимацию для блока. Я обычно обращаюсь к самой простой и популярной библиотеки aniview. К слову, вы можете как угодно обрабатывать скроллы, все эффекты анимации вынесены в отдельный css файл - animate.css. Я не однократно пользовался этой css-библиотекой, чего и вам советую. Там собраны все-возможные эффекты, которые Вы можете посмотреть на сайте по ссылке. А что же представляет собой библиотека aniview.js ? Она обрабатывает блоки с классом aniview (вы можете задать любой другой). Пример:

<div class="aniview"  av-animation="fadeInRight">

av-animation - вы задаете эффект выхода из библиотеки выше. 

Вызов функции:

$(document).ready(function(){
var i={animateThreshold:100};
$(".aniview").AniView(i)
});

Вы задаете название класса и скорость.

Пример и скачать библиотеку Вы можете на сайте. Скажу, что для меня в свое время, это было целое спасение проекта. Буду верить, что и Вам пригодиться. С уважением к вашим работам!

Похожее

draw I
draw I
draw I
draw I

На сайте могут присутствовать ссылки ePN

Если вдруг вам было здесь полезно, уютно и приятно, что захотелось меня отблагодарить - вы можете пожертвовать мне на кофе.

i

Будет осуществлен переход на сайт Yoomoney

 

draw I

 

Мини-портфолио: следующие сайты, в свое время, я написал :-)

очередной бесполезный блог