在滾動條上滾動100vh部分

這是一個普遍問題，但我試圖找到一些代碼示例以及用於此類行爲的術語以及如何實現它。在滾動條上滾動100vh部分

實施例：https://pixelheads.nl/

每一部分都充分滾動到視圖上滾動。

來源

2017-03-05 Snorlax

不知道它叫什麼。「單頁/一頁滾動」也許？ fullpage.js是一個庫，它會這樣做http://alvarotrigo.com/fullPage –

謝謝，可以用指定的部分完成，當我嘗試自己的，它不適用於其他部分，例如：https： //jsfiddle.net/jzhang172/7b2w82x2/ – Snorlax

@Snorlax所有部分必須與[文檔中所述（https://github.com/alvarotrigo/fullPage.js#required-html-structure）中所述的相同包裝）。 – Alvaro

尋找這個例子的javascript，我們可以看到該頁面與所有元素一個接一個地工作，但是當他放置命令overflow:hidden;時，該頁面不顯示滾動條。

要賦予所有頁面的效果，會有一個「translate3d」效果和頁面「滾動」。要顯示第二頁：

transform: translate3d(0px, -622px, 0px);

對於第三：

transform: translate3d(0px, -1244px, 0px);

我不發現命令到頁面，以獲得鼠標滾輪，但你可以把將要發射時一個事件你滾動頁面。

$("body").bind("mousewheel", function(e) 
{ 
    var delta = e.originalEvent.wheelDelta; // give you the direction 
    // here you apply the transform on the page. 
});

我不知道，如果這個例子頁面是使用任何框架，但我發現這個問題，可以幫助你，如果你不想從一開始就做。在這個問題上討論過的圖書館與邁克爾克勞克評論（alvarotrigo.com/ fullPage）相同。

scroll a full page height up or down with jQuery/Javascript

我知道反應是不完整的，但可以給你一些方向。

來源

2017-03-05 02:45:43

謝謝，可以用指定的部分完成，當我嘗試自己的時候，它不適用於其他部分，例如：jsfiddle.net/jzhang172/7b2w82x2 – Snorlax

您需要將代碼放入部分，如下所示： [jsfiddle]（https://jsfiddle.net/7b2w82x2/1/） –

如果要插入頁面或任何靜態對象的標題，請使用'position：fixed'像這樣：[jsfiddle]（https：// jsfiddle.net/7b2w82x2/2/） –

在滾動條上滾動100vh部分

回答

相關問題