如何使瀏覽器保持滾動固定的位置？

Question

如何防止瀏覽器滾動，或者如何讓瀏覽器不斷滾動到固定的位置？

我正在為Nintendo 3DS瀏覽器開發一個庫。 我使頁面完全適合瀏覽器，但向上箭頭使其滾動，因為底部屏幕是唯一被識別為可見區域的窗口。

我想這樣做，所以div #bottomScreen是底部屏幕中唯一的東西，禁用滾動是我認為唯一可行的方法。

我已經想出如何將它滾動到所述位置

document.body.scrollTop = 220;

我怎樣才能讓它不斷進入這個位置？

使用setTimeout創建重復計時器並將上面的代碼放入其中將不起作用。 我相信這是因為這僅適用於頁面加載之前。

關於如何執行它的任何建議？

Answer 1

更優雅的解決方案是在調用該方法時禁用滾動（從頂部或其他任何位置滾動到220的位置），並在用戶等采取適當的操作時重新啟用它... jQuery示例：

$('body').css('overflow', 'hidden'); // removes scrollbars entirely
$('body').css('overflow', 'auto'); // re-enable scrolling

否則，使用setInterval（）以非常短的間隔（如10ms）重復觸發滾動功能。 如果你打算這樣做，最好添加一些邏輯來查看窗口是否已經滾動到大約正確的位置（允許+/- 10px或其他東西），這樣對用戶來說並不是非常刺耳。

Answer 2

它甚至可以在頁面加載后工作。 這是代碼，雖然我不確定代碼的意圖是什么，可能會讓用戶煩惱。

setInterval( function(){ document.body.scrollTop = 200 }, 500 ); // set your time

Answer 3

我在某些網站上看到的最好的方式（比如我認為推特或推出圖片時的臉書），這就是將溢出屬性設置為隱藏在body元素上。 這可以防止任何滾動，因此當您這樣做時，您需要擔心的是內容的位置。

我想你需要將內容包裝在某種容器元素中，當你更改body元素的溢出時，你還要設置容器的y坐標以顯示正在查看的頁面的特定區域。

到目前為止，這是我見過的最好的效果，因為它不需要定時器等。

Answer 4

您可以為scroll事件添加事件偵聽器，然后設置位置。