三种方法实现Javascript控制ScrollBar(滚动条)
三种方法实现Javascript控制ScrollBar(滚动条)
kenneth5530 发表于3年前
三种方法实现Javascript控制ScrollBar(滚动条)
  • 发表于 3年前
  • 阅读 14
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云实验室 1小时搭建人工智能应用,让技术更容易入门 免费体验 >>>   

在Javascript中有三种方法能够控制滚动条的位置,下面我们就分别来看看吧!

       方法一:用scroll函数实现

        scroll(x,y);

        x代表横向滚动条的位置,也就是控制左右位置,当为0时代表最左边,当为document.body.scrollWidth时代表最右边

        y代表纵向滚动条的位置,也就是控制上下位置,当为0时代表最上面,当为document.body.scrollHeight时代表最下面

       方法二:用scrollBy函数实现

        scrollBy(x,y);

        x和y代表的意思和第一个方法一样;-)

       方法三:用scrollTo函数实现

        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);


共有 人打赏支持
粉丝 2
博文 15
码字总数 6563
×
kenneth5530
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: