Question

当我们点击下一个或上一个按钮时，我看到了this website，它会滑动不同的网页。我想要同样的效果，但我找不到这样做的方法。你能用HTML，CSS和JQuery或Javascript代码发布答案。

Answer 1

这里只是一种方法！

<强> HTML

<div id="item1" class="page"><a href="#item2">1</a></div>
<div id="item2" class="page"><a href="#item3">2</a></div>
<div id="item3" class="page"><a href="#item4">3</a></div>
<div id="item4" class="page"><a href="#item1">4</a></div>

<强> CSS

html, body {height:100%; margin:0; overflow-y:hidden}
.page {position:absolute; width:100%; height:100%}
#item1 {left:0%; background:#222}
#item2 {left:100%; background:#444}
#item3 {left:200%; background:#666}
#item4 {left:300%; background:#888}

<强> JS

$(function() {
    $('a[href*=#]').on('click', function(e) {
        var hash = $(this.hash).position();
        if (hash) {
            $('html, body').stop().animate({
                scrollLeft: hash.left
            }, 600, 'swing');
            e.preventDefault();
        }
    });
});

Answer 2

只需创建超广网站，然后使用 Javascript 滚动到下一部分。

使用框架可能是您的解决方案。请检查此link

JQuery - 滑动

2 个答案: