三种方法实现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>

若是是在框架中，须要控制框架的ScrollBar,那么要加parent，例如parent.scrollTo(0,0);