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 ...
随机推荐
- dropload上拉加载更多
<link href="~/Scripts/dropload/dropload.min.css" rel="stylesheet" /> <s ...
- ISCC 2018——write up
WEB Web1-比较数字大小 直接修改input 标签里的maxlength 为999突破长度限制,使得能输入大于999 的数,然后随便输一个数字就行了 或者post修改值 Web2-Web01 s ...
- Oracle VM VirtualBox 安装XP、Win 7
测试要求 为了少写点lr脚本(其实是不会写),看到fiddler的saz格式文件可以由loadrunner 12读取,本机安装了lr 11,打算虚拟机安装lr 12.通过共享文件夹把文件传过去,生成脚 ...
- jsp+spring+jquery+ajax的简单例子
初学b/s编程,花费了许多时间,进度颇慢! 不过终于完成了一个简单的例子: jsp代码 <%@ page language="java" contentType=" ...
- 全盘解决eclipse之maven项目报错
每次新建maven的web(war包方式)项目时都会报错而且都要手动改,很麻烦 解决:(注意里面的jdk版本换成自己的) 改变maven配置文件 settings.xml 在文件的<prof ...
- Java语言利用Collections.sort对Map,List排序
1.main方法包含TreeMap排序1,TreeMap排序2,HashMap排序,List<Integer>排序,List<Bean>排序,List<Map>排序 ...
- 路由器基础设置之ospf
我们将以上面的拓扑图来进行实验,要用ospf的协议达到全网互通的效果 router1: enable 进入特权模式 config t 进入全局配置模式 interface L0 ip address ...
- Redis缓存数据库的安装与配置(1)
1.安装 tarxf redis-3.2.5.tar.gz cd redis-3.2.5 make mkdir -p /usr/local/redis/bin src目录下这些文件作用如下 redis ...
- mongodb常用命令学习笔记
mongodb常用命令学习笔记 创建数据库 use DATABASE_NAME eg: use users; 如果数据库不存在,则创建数据库,否则切换到指定数据库.要显示刚刚创建的数据库,需要向数据库 ...
- jq 一个强悍的json格式化查看工具
本文来自网易云社区 作者:娄超 在web 2.0时代json这种直观.灵活.高效数据格式基本已经成为一种标准格式,从各种web api,到配置文件,甚至现在连mysql都开始支持json作为数据类型. ...