JS 窗口滚动条理解

来源:互联网 发布:矩阵分解应用 编辑:程序博客网 时间:2024/05/21 22:39

首先    window.innerHeight  表示浏览器可见或可用高度

如果body中的元素总高度超越上面的高度,默认body会出现滚动条 

那么 document.body.scrollHeight  就表示 所有元素总高度     它当然大于 window.innerHeight

还有 document.body.scrollTop 就表示 当前页面相对于总高度的位置,有的文档也说它是滚动条的位置。

上面的话还有点抽象,下面用数据表示

假设 window.innerHeight  窗口可见高度为 600px

document.body.scrollHeight  所有元素总高度为900px 

那么 就会出现滚动条

document.body.scrollTop  的范围 为 0 - 300

当滚动条位于 最顶端 未滑动时 document.body.scrollTop 的值为 0 

当滚动条位于 最底端时 document.body.scrollTop 的值为 300 

完美!



0 0
原创粉丝点击