0

我正在尝试制作一个网站滚动 div。当访问者想要滚动时，它应该自动转到下一个或上一个 div。

下面你可以看到我的 html 的样子。

<body>
    <header>
    </header>
    <div id="content">
        <div id="contentv1">
        </div>
        <div id="contentv2">
        </div>
        <div id="contentv2">
        </div>
        <div id="contentv2">
        </div>
        <div id="contentv3">
        </div>
    </div>
</body>

我正在尝试使用以下代码：

(function() {
var scrollTo = function(element) {
    $('html, body').animate({
        scrollTop: element.offset().top
    }, 500);
}
$('body').mousewheel(function(event) {
    event.preventDefault();
    var $current = $('#content > .current');
    if ($current.index() != $('#content > div').length - 1) {
        $current.removeClass('current').next().addClass('current');
        scrollTo($current.next());
    }
});
$('body').mousewheel(function(event) {
    event.preventDefault();
    var $current = $('#content > .current');
    if (!$current.index() == 0) {
        $current.removeClass('current').prev().addClass('current');
        scrollTo($current.prev());
    }
});
})();

标头的高度为 10% 并固定在顶部。内容 div 的高度为 90%。因此，当滚动内容 div 的顶部时，应该与标题的底部对齐。

任何人都可以帮助我走向正确的方向吗？

4

0 回答 0