當用戶到達某個點滾動網頁時,是否可以更改滾動條位置?例如,一旦您到達頁面的中間位置,滾動條就會自動移動回頂端。更改滾動條位置
Q
更改滾動條位置
18
A
回答
29
可以計算使用onscroll事件滾動條的當前位置的百分比,如果達到50%的滾動位置可以設置爲頁面的頂部與scrollTo功能:
window.onload = function() {
window.onscroll = function() {
var doc = document.body,
scrollPosition = doc.scrollTop,
pageSize = (doc.scrollHeight - doc.clientHeight),
percentageScrolled = Math.floor((scrollPosition/pageSize) * 100);
if (percentageScrolled >= 50){ // if the percentage is >= 50, scroll to top
window.scrollTo(0,0);
}
};
};
您可以查看我的示例here。
9
是的,我已經看過幾次了。下面是一些JS代碼:
window.scrollBy(0,50)
50要通過滾動的像素數量。
2
(window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop)應該在幾乎任何瀏覽器中爲您提供當前滾動位置。
4
您需要關注的三個滾動功能是window.scroll(x,y)
,window.scrollBy(dx,dy)
和window.scrollTo(x,y)
。
正如David所說,您需要滾動位置才能知道您的位置,並使用window.onscroll
事件觸發此計算。
+1
這些可在所有瀏覽器上使用,或者需要某些功能檢測嗎? – 2011-10-04 00:32:54
相關問題
- 1. 更改TextBox中的滾動條位置?
- 2. 滾動條位置
- 3. 要改變滾動條位置
- 4. 如何更改設置位置的滾動條軌道顏色?
- 5. 更改滾動條
- 6. 在C++中更改面板中自動滾動條的位置
- 7. 重置ItemsSource上的滾動條更改
- 8. 無限滾動滾動條位置跳
- 9. ListView項目更改滾動位置
- 10. 更改JInteranlFrame中JTable的滾動位置
- 11. jquery鼠標滾動更改div位置
- 12. 基於滾動位置更改圖像
- 13. 更改滾動div的位置
- 14. 更改完全滾動位置在ListView
- 15. 更改滾動位置上的圖像
- 16. 根據URL更改UIWebView滾動位置
- 17. 水平滾動更改位置winform
- 18. jquery更改滾動位置上的css
- 19. 根據滾動條當前所處的位置更改內容?
- 20. 更改表單位置/大小後滾動條消失
- 21. 如何更改Chrome滾動條填充位置?
- 22. 更改WPF Datagrid中滾動條的位置
- 23. 如何使用滾動條重置滾動條內的滾動條位置?
- 24. WPF滾動條位置
- 25. Android AlertDialog滾動條位置
- 26. 默認滾動條位置
- 27. 計算滾動條位置
- 28. Highchart滾動條位置
- 29. 固定滾動條位置
- 30. 如何使用jQuery或JavaScript更改光標位置或滾動條位置?
@CMS:優秀的答案! – Josh 2009-08-08 14:47:18
window.scrollTo(0,0); 不適合我在chomre – SuperUberDuper 2016-05-24 09:54:13