天天看點

[轉]實作頁面打開後滾動到最底端的效果

 ​

    滾動頁面的方法有scroll、scrollBy和scrollTo,三個方法都帶兩個參數:x(X軸上的偏移量)和y(Y軸上的偏移量)。因為是要滾動到頁面底部,是以參數x為0,y為頁面的滾動高度。另外,頁面的滾動高度必須在網頁加載完成後才能擷取到,是以觸發事件用onload。

  具體步驟:

  方法一:用scroll方法實作。

<body onload="scroll(0,document.body.scrollHeight) ">

<script>

document.write(new Array(100).join("<br>"))

</script>

  方法二:用scrollBy方法實作。

<body onload="scrollBy(0,document.body.scrollHeight) ">

  方法三:用scrollTo方法實作。

<body onload="scrollTo(0,document.body.scrollHeight)">

  注意:因為頁面加載完後預設滾動在最頂端,是以在本例中用scroll、scrollBy和scrollTo方法的效果一樣,然而它們之間其實是有差別的。

  特别提示

  本例三種方法的代碼運作後,在頁面加載完成後将自動滾動到頁面最底端,效果如圖 

圖1.7.3 加載完成後自動滾動到頁面底端的效果

  特别說明

  告訴讀者通過該問題的解決過程,需要掌握什麼内容或技巧,你能夠學到什麼,以及其他相關的知識點。

  scroll 将視窗滾動到自左上角起指定的 x 和 y 偏移量。

  scrollBy 将視窗滾動 x 和 y 偏移量。

  scrollTo 将視窗滾動到指定的 x 和 y 偏移量。