当前位置:网站首页>DOM系列之scroll系列
DOM系列之scroll系列
2022-07-31 00:35:00 【老__L】
1、scroll概述
scroll 翻译过来就是滚动的,我们使用 scroll 系列的相关属性可以动态的得到该元素的大小、滚动距离等。
2、scroll系列属性
3、页面被卷去的头部
如果浏览器的高(或宽)度不足以显示整个页面时,会自动出现滚动条。当滚动条向下滚动时,页面上面被隐藏掉的高度,我们就称为页面被卷去的头部。滚动条在滚动时会触发 onscroll 事件。
4、页面被卷去的头部兼容性解决方案
需要注意的是,页面被卷去的头部,有兼容性问题,因此被卷去的头部通常有如下几种写法:
- 声明了 DTD,使用
document.documentElement.scrollTop
- 未声明 DTD,使用
document.body.scrollTop
- 新方法
window.pageYOffset
和window.pageXOffset
,IE9 开始支持
function getScroll() {
return {
left: window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0,
top: window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
};
}
使用的时候 getScroll().left
后记
如果你感觉文章不咋地
//(ㄒoㄒ)//
,就在评论处留言,作者继续改进;o_O???
如果你觉得该文章有一点点用处,可以给作者点个赞;\\*^o^*//
如果你想要和作者一起进步,可以微信扫描二维码,关注前端老L;~~~///(^v^)\\\~~~
谢谢各位读者们啦(^_^)∠※
!!!
边栏推荐
- WEB Security Basics - - - Vulnerability Scanner
- Go 学习笔记(84)— Go 项目目录结构
- 封装、获取系统用户信息、角色及权限控制
- xss绕过:prompt(1)
- ES6中 async 函数、await表达式 的基本用法
- The difference between truncate and delete in MySQL database
- How to solve types joiplay simulator does not support this game
- Gabor filter study notes
- WEB安全基础 - - -漏洞扫描器
- ELK部署脚本---亲测可用
猜你喜欢
随机推荐
Oracle一个诡异的临时表空间不足的问题
Go study notes (84) - Go project directory structure
DNS resolution process [visit website]
What are the efficient open source artifacts of VSCode
【愚公系列】2022年07月 Go教学课程 013-常量、指针
寄存器(汇编语言)
Summary of MySQL database interview questions (2022 latest version)
GO GOPROXY代理设置
mysql主从复制及读写分离脚本-亲测可用
Error occurred while trying to proxy request项目突然起不来了
C language force buckles the rotating image of the 48th question.auxiliary array
A Brief Talk About MPI
【深入浅出玩转FPGA学习15----------时序分析基础】
Restricted character bypass
MySQL database advanced articles
MPI简谈
what is jira
In-depth understanding of the auto-increment operator from two error-prone written test questions
MySql数据恢复方法个人总结
MySQL table design for message queue to store message data