Как воспроизвести последовательность изображений в элементе div, используя эффект вертикальной прокрутки jQuery - PullRequest
0 голосов
/ 06 февраля 2012

Я экспериментировал с jQuery для анимации элементов страницы на основе вертикальной позиции прокрутки Что-то похожее на сайт Nike Better World . Я довольно твердо понимаю, как это сделать. Мне интересно, если кто-нибудь знает, как также воспроизводить последовательность изображений. Например, один из элементов div, который представляет собой PNG (скажем, туфельку), вместо этого будет png-последовательностью, когда пользователь прокручивает изображение вниз, оно воспроизводится.

Ответы [ 2 ]

1 голос
/ 06 сентября 2012

Nike лучше мир использует параллакс прокрутки , но если вы хотите поменять местами изображения во время прокрутки, я рекомендую взглянуть на этот прокрутка видео , jsMovie плагин и взгляните на эту последовательность анимированных изображений javascript . Надеюсь, это поможет ...

0 голосов
/ 09 февраля 2012

Если бы это был я, я бы прикрепил его к инкрементальному сдвигу прокрутки и переключал активный / выбранный класс вниз по последовательности, чтобы показать / скрыть каждый кадр. Отличный пример: http://discover.store.sony.com/tablet/#intro Вы бы хотели сосредоточить свои усилия на творческом управлении нагрузкой, так как эти png начали бы быстро складываться. Я думаю, что лучше работать со встроенными изображениями за пределами определенного физического размера. Но если ваши анимации / изображения маленькие, смещение фонового спрайта будет более эффективным. Я не получаю баллов за решение, без кода, но, тем не менее, я бы подошел к нему. Отдельный пример можно найти на сайте smartcarusa.com, в 4-м или 5-м разделе. Здесь они достигают эффекта разнесенной кожи, сдвигая div и 'x- и y-pos на прокрутке.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...