三種方法實現Javascript控制ScrollBar(滾動條)

時間 2021-05-17

標籤框架 ide 函數 spa xml class scroll 方法欄目 JavaScript 简体版

原文原文鏈接

在Javascript中有三種方法可以控制滾動條的位置，下面咱們就分別來看看吧！框架

方法一：用scroll函數實現ide

scroll(x,y);函數

x表明橫向滾動條的位置，也就是控制左右位置，當爲0時表明最左邊，當爲document.body.scrollWidth時表明最右邊spa

y表明縱向滾動條的位置，也就是控制上下位置，當爲0時表明最上面，當爲document.body.scrollHeight時表明最下面xml

方法二：用scrollBy函數實現ip

scrollBy(x,y);it

x和y表明的意思和第一個方法同樣;-)class

方法三：用scrollTo函數實現scroll

scrollTo(x,y);方法

x和y表明的意思和第一個方法同樣;-)

另外順便說一句，若是你是在框架(Frame)中要控制父框架的滾動條，那麼要記得在函數前加parent，舉個例子來講就是parent.scroll(0,0);

用Javascript控制ScrollBar(滾動條)

如下都是默認自動滾動到底部，須要滾動到頂部只需將document.body.scrollHeight換爲0.

方法一：用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) ">   
   
   
            
   
   <script>   
   
   
            
   
   document.write(new Array(100).join("<br>"))   
   
   
            
   
   </script>

方法三：用scrollTo方法實現

  
  
           
  
  
   
   
            
   
   <body onload="scrollTo(0,document.body.scrollHeight)">   
   
   
            
   
   <script>   
   
   
            
   
   document.write(new Array(100).join("<br>"))   
   
   
            
   
   </script>