Анимировать HTML-элемент в позиции прокрутки

Что я хотел бы сделать, это анимировать через CSS3 некоторый HTML, когда прокрутка достигает определенной позиции.Анимировать HTML-элемент в позиции прокрутки

Я плавал в JQuery плагин учредительных множество интересных вещей, такие как параллакс или гармонические свитки, и ближе всего я нашел это популярные ленивых нагрузок, которые задерживают загрузку изображений при прокрутке страницы. Что бы я хотел сделать, это что-то вроде этого, но с анимированным div или img или a.

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

Заранее спасибо.

источник

2013-06-16 oil-gap

Вы должны использовать функцию jQuery scrollTop() с событием scroll. Может быть, как это:

$(window).scroll(function(){ 
    var top = $(this).scrollTop(); 
    if(top > 150){ 
     //do something after it scrolls down past 150px  
    } 
});

Надеется, что это помогает :)

источник

2013-06-16 15:15:06 sirmdawg

Я собираюсь попробовать прямо сейчас ... Я дам вам знать! Спасибо! –

Ничего себе это определенно работает спасибо! Я пробовал с некоторой базовой анимацией, и это очень хорошо! В любом случае, чтобы сделать HTML-код, я перейду к определенной позиции, чтобы я мог определять анимацию через CSS3. Поскольку DIV будет запущен Javascript, анимация начнется с создания DIV с помощью jQuery ... Еще раз спасибо! –

Может захотеть что-то сделать с помощью функции .addClass ('animateThis'); '. – sirmdawg

Если я понимаю ваши потребности, вы ищете что-то вроде Transe. Он позволяет вам преобразовывать и анимировать элементы, зависящие от текущего смещения прокрутки.

Вот супер простой демо: http://fiddle.jshell.net/ARTsinn/mqcTr/

https://github.com/yckart/jQuery.transe.js/

Другим решением является Scrollorama.

источник

2013-06-16 15:32:42 yckart

Большое спасибо yckart, это наверняка очень интересный плагин. К сожалению, это не то, что я ищу. Мне не нужно изменять свойства анимации во время прокрутки, мне просто нужны точки останова, где, когда прокручивается страница, DIV появляется, показывая, что это контент с некоторой классной анимацией. Но как только он появился, он остается там! –

Анимировать HTML-элемент в позиции прокрутки

ответ

Смежные вопросы