Активация анимации при прокрутке

Question

Активация анимации при прокрутке

0

Я использую http://www.justinaguilar.com/animations/index.html в проекте и не могу заставить анимацию активироваться при прокрутке. Анимация начинается, как только я загружаю эту страницу.

http://jsfiddle.net/m2phK/

$(window).scroll(function() {
    $('#object').each(function(){
    var imagePos = $(this).offset().top;

    var topOfWindow = $(window).scrollTop();
        if (imagePos < topOfWindow+200) {
            $(this).addClass("fadeIn");
        }
    });
});

lala 23 янв. 2014, в 17:18

Источник

1

$('#object').each( ... кажется странным, у вас есть только один элемент с таким идентификатором, верно?
adeneo 23 янв. 2014, в 15:33
0

$ .each () предназначен для работы над коллекцией объектов. Вы тестировали эту часть, чтобы убедиться, что она реализована правильно?
jskidd3 23 янв. 2014, в 15:35
0

Хм, я скопировал код прямо из источника. Мне интересно, я что-то пропускаю?
lala 23 янв. 2014, в 16:12

Показать ещё 1 комментарий

Теги:

jquery

css3

animation

1 ответ

Ещё вопросы

$('#object').each( ... кажется странным, у вас есть только один элемент с таким идентификатором, верно?
$ .each () предназначен для работы над коллекцией объектов. Вы тестировали эту часть, чтобы убедиться, что она реализована правильно?
Хм, я скопировал код прямо из источника. Мне интересно, я что-то пропускаю?

paelzer · Answer 1 · 2014-04-26T07-16-00.000Z

Я изменил сценарий, так что он запускает анимацию, как только ящик входит в область просмотра.

http://jsfiddle.net/yq3Hc/

$(window).scroll(function() {
        $('#object').each(function(){
        var imagePos = $(this).offset().top;

        var topOfWindow = $(window).scrollTop();
            if (imagePos < topOfWindow+imagePos) {
                $(this).addClass("fadeIn");
            }
        });
});

Прежде чем добавить "imagePos", было значение (в вашем случае 200). Это означает, что вам нужно прокрутить окно до 200px между верхней частью окна браузера и полем. Поскольку ничто не приходит после вашего ящика, и вы не можете пропустить его так далеко, вам нужно это изменить.

Надеюсь, это поможет.