0

Есть скрипт

function come(elem) {
var docViewTop = $(window).scrollTop(),
    docViewBottom = docViewTop + $(window).height(),
    elemTop = $(elem).offset().top,
    elemBottom = elemTop + $(elem).height();

     return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
}

function mainAnim() {
   if (come('.js-animation')) {
      $('.js-animation').addClass('animation');
   }
}

$('.js-animation').each(function () {
    $(document).on('scroll', function () {
        mainAnim();
});

mainAnim();

});

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

Как правильно перебрать все js-animation через each и добавить класс только там, куда доскролили

2
  • Что значит что бы animation добавился до текущего js-animation? 22 янв 2019 в 8:21
  • @StepanKasyanenko ну есть 4 блока .js-animation и сейчас когда доскролил до первого .js-animation то класс animation добавляется все остальным блокам.
    – drtvader
    22 янв 2019 в 8:27

1 ответ 1

1

Попробуйте такой вариант:

$(function () {
    function come(elem) {
        var docViewTop = $(window).scrollTop(),
            docViewBottom = docViewTop + $(window).height(),
            elemTop = elem.offset().top,
            elemBottom = elemTop + elem.height();

        return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
    }

    function mainAnim() {
        $('.js-animation').each(function(){
            var elem = $(this);
            if (come(elem)) {
                elem.addClass('animation');
            }
        })
    }

    $(document).on('scroll', function () {
        mainAnim();
    });
    mainAnim();
});

Данный код нужно оптимизировать в плане перформанса, но в целом работать должен.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.