Question

我用其他网站上的JS / Jquery编码了自己的整页滚动器，这还可以，但是当用户滚动得太慢或太快时，仍然会有一些默认值。

有时页面一次滚动两个部分
有时页面会滚动到某个部分，然后再增加几像素滚动

我想这与反跳有关，但我不确定如何正确执行！看来我添加的setTimeout和ticking不够或使用不充分...

这是代码

// FULLPAGE SCROLLER
var lp = 0;
var ticking = false;
var isScrolling = false;
var scrollSensitivitySetting = 10; //Increase/decrease this number to change sensitivity to trackpad gestures (up = less sensitive; down = more sensitive) 
var slideDurationSetting = 750; //Amount of time for which slide is "locked"
var currentSlideNumber = 0;
var totalSlideNumber = $(".vc_row-o-full-height").length; //Class identifying fullpage section  

function homeScroll(){  
    setTimeout(function() { 
    var st = $(window).scrollTop();
    if (!ticking){          
        if (st > lp && (st-lp)>scrollSensitivitySetting){
            ticking = true;
            if (currentSlideNumber<totalSlideNumber){
                currentSlideNumber++;
                $("html, body").animate({scrollTop:(window.innerHeight*currentSlideNumber)+"px"}, slideDurationSetting, 'easeOutQuint');                                        
            }               
            setTimeout(function() { ticking = false; }, slideDurationSetting);
        } 
        if (st < lp && (lp-st)>scrollSensitivitySetting){
            ticking = true;
            if (currentSlideNumber>0){
                currentSlideNumber--;
                $("html, body").animate({scrollTop:(window.innerHeight*currentSlideNumber)+"px"}, slideDurationSetting, 'easeOutQuint');                    
            } 
            setTimeout(function() { ticking = false; }, slideDurationSetting);
        }
    }
    lp = $(window).scrollTop();
    }, 800);
}   
// FULLPAGE SCROLLER END

// ON SCROLL
window.addEventListener("scroll", function(){
    homeScroll();
});

感谢您的帮助！

取消自定义全页滚动条

0 个答案: