0

Такая задача: При любом скроле выполняется анимация блока. То есть: раз проскролил - виежает блок, еще раз - убирается.

$('.scroll-block').on('mousewheel DOMMouseScroll MozMousePixelScroll', function(){
   var intervalID;

    intervalID = setTimeout(
        function(){
            if($(".ser-bottom-text").hasClass("hide")){
                $(".ser-bottom-text").removeClass("hide");

             } else {
                $(".ser-bottom-text").addClass("hide");

             }
        }, 200);
});

Нужно сделать так, что бы реакция была после остановки колесика. То есть, какой длины бы не был скрол - после этого происходила анимация (добавление/убирание класса).

1 ответ 1

0

остановка колесика это отсутствие события scroll некоторое время, определите какое время считается остановкой, в текущей реализации вижу только одну проблему - перед setTimeout надо сделать

clearTimeout(intervalID);

и var intervalID надо вынести выше всего этого кода.

ну и для простоты можно вместо кучи условий сделать toggleClass

jQuery(function ($) {
    var intervalID, $bottomtext = $(".ser-bottom-text");
    $('.scroll-block').on('scroll', toggleBlock);

    function toggleBlock() {
        clearTimeout(intervalID);
        intervalID = setTimeout(function () {
            $bottomtext.toggleClass('hide');
        }, 200);
    }
});

демо

Ваш ответ

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

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