微客导航 » 文章资讯 » js浏览器滚动条卷去的高度scrolltop(实例讲解)

js浏览器滚动条卷去的高度scrolltop(实例讲解)

2024-02-16 18:36:03 233

1、之前我们学习的JS盒子模型中：client系列/offset系列/scrollWidth/scrollHeight都是“只读”的属性->只能通过属性获取值，不能通过属性修改元素的样式

2、scrollTop/scrollLeft:滚动条卷去的高度/宽度（这两个属性是唯一“可读写”的属性）

box.scrollTop=0//直接回到容器的顶部

我们的scrollTop的值是存在边界值（最大和最小值），我们设置的值比最小值小或者比最大值大都没用，起到效果的依然是边界的值

[最小值是零]

box.scrollTop=-1000;//直接回到了容器的顶部，没有超出

console.log(box.scrollTop)//0

[最大值=真实的高度-当前容器一屏幕的高度]

varmaxTop=box.scrollHeight-box.clientHeight;

scrollTop最经典的应用就是回到顶部，下面代码如下：





Title



GO
//A标签本身是跳转页面的，把跳转的地址写在href这个属性中
/*
1）、不写值的话是刷新本页面
2）、写的如果是#target，是锚点定位，定位到当前页面Id为target这个位置
3）、“javascript:”这样写是取消A标签默认跳转的行为
*/

以上这篇js浏览器滚动条卷去的高度scrolltop(实例讲解)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。