您现在的位置是:网站首页> 编程资料编程资料

js实现控制整个页面滚动条的位置_javascript技巧_

2023-05-24 401人已围观

简介 js实现控制整个页面滚动条的位置_javascript技巧_

js控制整个页面滚动条位置

方法一

1、通过div的scrollTop变动控制垂直滚动条位置。通过div的scrollLeft变动控制水平滚动条位置。

示例:

 //d1是外层div,带滚动条 
2222

方法二

2、用html锚点

如下:

aaaaa
lalallalalalala

js滚动条属性、设置滚动条滚动速度

返回不带px的数值,没用负数,最小为0

  • .scrollTop:竖直滚动条到顶部的距离,即浏览器视口外的高度
  • .scrollLeft:水平滚动条到最左边的距离
  • .scrollHeight:滚动内容区域的高度

返回整个窗口的滚动条数值

非ie        

返回整个窗口的滚动条数值

  • document.documentElement.scrollTop:竖直滚动条到顶部的距离
  • document.documentElement.scrollLeft:水平滚动条到最左边的距离

ie和非ie获得滚动条的兼容写法      

var temp=document.documentElement.scrollTop||document.body.scrollTop

设置滚动条速度代码示例

滚动事件

以上为个人经验,希望能给大家一个参考,也希望大家多多支持。

-六神源码网