javascript获取和判断浏览器窗口、屏幕、网页的高度、宽度等
主要介绍了javascript获取和判断浏览器窗口、屏幕、网页的高度、宽度等
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX 相对文档的水平座标
event.clientY 相对文档的垂直座标
event.offsetX 相对容器的水平坐标
event.offsetY 相对容器的垂直坐标
document.documentElement.scrollTop 垂直方向滚动的值
event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量
IE,FireFox 差异如下:
IE6.0、FF1.06+:
clientWidth = width + padding
clientHeight = height + padding
offsetWidth = width + padding + border
offsetHeight = height + padding + border
IE5.0/5.5:
clientWidth = width – border
clientHeight = height – border
offsetWidth = width
offsetHeight = height
提示:CSS中的margin属性,与clientWidth、offsetWidth、clientHeight、offsetHeight均无关
网页可见区域宽: document.body.clientWidth
网页可见区域高: document.body.clientHeight
网页可见区域宽: document.body.offsetWidth (包括边线的宽)
网页可见区域高: document.body.offsetHeight (包括边线的高)
网页正文全文宽: document.body.scrollWidth
网页正文全文高: document.body.scrollHeight
网页被卷去的高: document.body.scrollTop
网页被卷去的左: document.body.scrollLeft
网页正文部分上: window.screenTop
网页正文部分左: window.screenLeft
屏幕分辨率的高: window.screen.height
屏幕分辨率的宽: window.screen.width
屏幕可用工作区高度: window.screen.availHeight
屏幕可用工作区宽度: window.screen.availWidth
javascript获取和判断浏览器窗口、屏幕、网页的高度、宽度等的更多相关文章
- jquery 获取浏览器窗口的可视区域高度 宽度 滚动条高
原文:http://www.open-open.com/code/view/1421827925437 alert($(window).height()); //可视区域高度 alert($(docu ...
- javascript 获取多种主流浏览器显示页面高度(转)
IE中:document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度document.docu ...
- JavaScript 客户端JavaScript之 脚本化浏览器窗口
1.计时器 客户端Javascript以全局函数setTimeOut().clearTimeOut().setInterval().clearInterval()提供这一功能. 前者是从运行的那一 ...
- JAVASCRIPT和JQUERY判断浏览器信息总汇(备忘)
<script type="text/javascript"> //jquery判断浏览器信息 $(function(){ ...
- JQuery获取浏览器窗口的可视区域高度和宽度,滚动条高度
alert($(window).height()); //浏览器时下窗口可视区域高度 alert($(document).height()); //浏览器时下窗口文档的高度 alert($(docum ...
- 如何用javascript高效的判断浏览器种类和版本
<script type="text/javascript"> var Sys = {}; var ua = navigator.userA ...
- 【javascript】—— JS判断浏览器类型、操作系统
navigator.userAgent : userAgent 属性是一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值. navigator.platform : platform ...
- JavaScript获取及判断文件类型
一.获取文件后缀 <input type="file" name="addvedio" accept="video/*"/>注: ...
- selenium中元素操作之浏览器窗口滚动&网页日期控件操作(js操作)(五)
js的滚动条scrollIntoView() Arguments[] - python与js之间的羁绊 1.移动到元素element对象的“底端”,与当前窗口的“底部”对齐: driver.execu ...
随机推荐
- P1330 封锁阳光大学 DFS+染色
题目链接:https://www.luogu.org/problemnew/show/P1330 这个题有意思,如果能想到染色,就会很简单,但若想不到就很麻烦 要想把一条边封锁,就必须且只能占据这条边 ...
- 初学Node.js -环境搭建
从毕业一直到现在都是在做前端,总感觉缺少点什么,java? PHP? .Net? 框架太多了,学起来不好掌握,听说node.js挺牛的,我决定把node.js好好的学一下.首先是环境的配置,这个配置真 ...
- react脚手架搭建1
23:01:17 react脚手架搭建 (个人用的是webstorm,所以分享下webstorm中的创建react脚手架项目的方法) 1.创建新项目(前提是下载nodejs环境) 2.下载好在webs ...
- 一个简易的android浏览器。求指教!
开发android的浏览器很简单吧,不过这浏览器倒是很简易.下面每一处代码都备注上注解了!废话不多说,下面直接上代码! 运行后界面 主界面的代码 activity_main.xml布局 <L ...
- JZOJ 5941. 乘
Sample Input Sample Input1: 4 3 9 6 5 8 7 7 Sample Output Sample Output1: 0做法(转自JZOJ):考虑 a 是定值, 而 b ...
- Java学习笔记十四:如何定义Java中的类以及使用对象的属性
如何定义Java中的类以及使用对象的属性 一:类的重要性: 所有Java程序都以类class为组织单元: 二:什么是类: 类是模子,确定对象将会拥有的特征(属性)和行为(方法): 三:类的组成: 属性 ...
- 链栈的c++实现
2013-08-30 20:58 1876人阅读 评论(0) 收藏 举报 链栈是借用单链表实现的栈.其不同于顺序栈之处在于: 1.链栈的空间是程序运行期间根据需要动态分配的,机器内存是它的上限.而顺序 ...
- h5调试工具
1.Safari:iPhone 调试利器,查错改样式首选: 2.iOS 模拟器:不需要真机,适合调试 Webview 和 H5 有频繁交互的功能页面: 3.Charles: Mac OS 系统首选的抓 ...
- myeclipse 安装pydev插件后svn插件失效
为了将python的IDE集成到myeclipse,按照教程安装了myeclipse插件pydev插件,但是按照完后发现,先前安装的svn不见了,解决办法如下: 1. 关闭myeclipse, 2. ...
- Mysql 启动运行
MYSQL默认端口:3306用户: root 也可自己添加用户启动数据库服务名: MYSQL (在安装的时候会设置) 在开始菜单栏->附件->右键命令提示符->以管理员身份运行: ...