jquery vertical mousewheel smooth scrolling

前端 未结 5 1030
傲寒
傲寒 2020-12-02 18:30

I\'m making a parallax website and I would like to make the page scroll smoother with the mousewheel for a better user experience. The best example I could get was this webs

5条回答
  •  無奈伤痛
    2020-12-02 19:09

    Here are two jsfiddles -- one with the script and one without it so you can compare:

    • with script
    • without script

    JavaScript using the jQuery mousewheel plugin:

    $(document).ready(function() {
        var page = $('#content');  // set to the main content of the page   
        $(window).mousewheel(function(event, delta, deltaX, deltaY){
            if (delta < 0) page.scrollTop(page.scrollTop() + 65);
            else if (delta > 0) page.scrollTop(page.scrollTop() - 65);
            return false;
        })
    });
    

    Compare the two. From what I can tell, the script slows the mouse wheel so it requires more physically turning to scroll the same distance as without the script. It may feel smoother because of that slower scrolling (and it may indeed be smoother as it is probably easier on the graphics unit).

提交回复
热议问题