使用引導程序，使幻燈片向上或向下滾動，而不是向左或向右滾動

Question

我見過一些網站有這樣的網站：他們的首頁上只有一頁（實際上他們有幾頁，但一次只顯示一頁），這意味着它們沒有垂直滾動條，但是當您將手指向上滾動並在觸摸板上向下滑動，主頁將平滑地上下滾動，顯示一些不同的內容。

就像您有一張幻燈片一樣，但是幻燈片會上下移動，而不是左右移動。 樣本鏈接： http : //tangyan.maxinrui.com/

有人可以告訴我如何做到這一點，也許使用Bootstrap嗎？ 或給我一個示例頁面。

提前致謝。

Answer 1

您可以使用按鈕來實現，我不知道您是否想要。

創建一個名為extra.js的文件，並在其中添加以下代碼：

$(document).ready(function(){
    $('a[href^="#"]').on('click',function (e) {
        e.preventDefault();

        var target = this.hash,
        $target = $(target);

        $('html, body').stop().animate({
        'scrollTop': $target.offset().top
        }, 900, 'swing', function () {
            window.location.hash = target;
        });
    });
});

在頁面上extra.js加載所有滾動鏈接。
（錨鏈接只是帶有'id =“ one”''href =“＃one”'的鏈接）
我認為當用戶滾動時要使其滾動時，可以將其連接到某些javascript。