проблема со скроллом на jquery

227
01 февраля 2018, 17:30
Проблема со скроллом, суть задачи, есть три блока, и они должны скролиться последовательно, остальной сайт как обычно. Все работает как надо, но, увеличил время анимации и увидел, что при скролле сначала макет скролится вниз, потом прыгает вверх, и потом плавно скролится, уже не знаю на что думать, может что подскажете?
window.todo = $(window).scrollTop();
window.allowScroll = true;
$(window).on('scroll', function(event){
    if (window.allowScroll) {           
        var scroll = $(window).scrollTop(),
            offsetHeader = $('div.header').offset().top,
            heightHeader = $('div.header').outerHeight(true),
            offsetWhatwecan = $('.hrwhatwecan').offset().top;
        if (window.todo == 0 && scroll > window.todo) {
            window.allowScroll = null;
            $.when($('html,body').animate( { scrollTop: offsetWhatwecan }, 5500)).then(function(){
                window.allowScroll = true;
                window.todo = offsetWhatwecan;
                $("body").css({"padding-right": '0', "overflow":"auto"});                               
            });             
        }
        var heightWhatwecan = $('.whatwecan').outerHeight(true) + $('.hrwhatwecan').outerHeight(true),
            offsetHranother_plusi = $('.hranother_plusi').offset().top;
        if (window.todo >= offsetWhatwecan && window.todo <= (offsetWhatwecan + heightWhatwecan)  && scroll < window.todo) {            
            window.allowScroll = null;
            $.when($('html,body').animate( { scrollTop: offsetHeader }, 5500)).then(function(){
                window.allowScroll = true
                window.todo = offsetHeader;
                $("body").css({"padding-right": '0', "overflow":"auto"});                               
            });
        }
        if (window.todo >= offsetWhatwecan && window.todo <= (offsetWhatwecan + heightWhatwecan)  && scroll > window.todo) {
            window.allowScroll = null;
            $.when($('html,body').animate( { scrollTop: offsetHranother_plusi }, 5500)).then(function(){
                window.allowScroll = true
                window.todo = offsetHranother_plusi;
                $("body").css({"padding-right": '0', "overflow":"auto"});                               
            });
        }
        var heightHranother_plusi = $('.another_plusi').outerHeight(true) + $('.hranother_plusi').outerHeight(true);
        if (scroll >= offsetWhatwecan && scroll <= (offsetWhatwecan + heightWhatwecan)  && scroll < window.todo) {
            window.allowScroll = null;
            $.when($('html,body').animate( { scrollTop: offsetWhatwecan }, 5500)).then(function(){
                window.allowScroll = true
                window.todo = offsetWhatwecan;
                $("body").css({"padding-right": '0', "overflow":"auto"});                               
            });             
        }           
        window.todo = scroll;           
    } else {            
        if (window.innerWidth - document.documentElement.clientWidth != 0) {
            $("body").css("padding-right", window.innerWidth - document.documentElement.clientWidth + 'px');
        }
        $("body").css("overflow", "hidden");            
    }
});
READ ALSO
javascript jquery вопрос про конкатенацию

javascript jquery вопрос про конкатенацию

Я передаю в аргумент функции elem - foo(elem);

188
Отправка цели в яндекс метрику при нажатии в стороннем виджете

Отправка цели в яндекс метрику при нажатии в стороннем виджете

На сайт повесил виджет колбекаОн не интегрирован с метрикой

226
One page scroll и изменением URL

One page scroll и изменением URL

Всем приветЕсть такой вот интересный сайт

255
Передача двух значений в функцию

Передача двух значений в функцию

Хочу по клике на ссылку передать два значения в функцию, делаю так:

230