如何使用Mousewheel一次向下滚动100％? -jQuery的 [英] How To Scroll down 100% with Mousewheel at once ? - jquery

问题描述

我正在为我的投资组合创建一个OnePage.

I'm creating a OnePage for my Portfolio.

每个站点都占据了屏幕的100％.我希望当我使用鼠标滚轮滚动时，该滚动条向下滚动100％，以便我直接进入下一个站点，而不是页面之间的某个地方.

Each site fills 100% of the Screen. And I want that when I use the Mouse-wheel to scroll, that one Scroll, scrolls down 100%, so that I come directly to the next site and not somewhere between the pages.

有人可以告诉我如何使用JS/jQuery解决此问题吗?

Can someone tell me how I can solve this problem with JS/jQuery?

推荐答案

您还可以使用以下onscroll处理程序，该处理程序基于

You can also use the following onscroll handler, it's based on this answer:

$(document).ready(function () {
    var divs = $('.mydiv');
    var dir = 'up'; // wheel scroll direction
    var div = 0; // current div
    $(document.body).on('DOMMouseScroll mousewheel', function (e) {
        if (e.originalEvent.detail > 0 || e.originalEvent.wheelDelta < 0) {
            dir = 'down';
        } else {
            dir = 'up';
        }
        // find currently visible div :
        div = -1;
        divs.each(function(i){
            if (div<0 && ($(this).offset().top >= $(window).scrollTop())) {
                div = i;
            }
        });
        if (dir == 'up' && div > 0) {
            div--;
        }
        if (dir == 'down' && div < divs.length) {
            div++;
        }
        $('html,body').stop().animate({
            scrollTop: divs.eq(div).offset().top
        }, 200);
        return false;
    });
    $(window).resize(function () {
        $('html,body').scrollTop(divs.eq(div).offset().top);
    });
});

这里是 jsfiddle 及其 查看全文