jQuery javascript获得网页的高度与宽度的实现代码


Posted in Javascript onApril 26, 2016

网页可见区域宽: 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

jquery

获取浏览器显示区域的高度 : $(window).height();
获取浏览器显示区域的宽度 :$(window).width();
获取页面的文档高度 :$(document).height();
获取页面的文档宽度 :
$(document).width();

获取滚动条到顶部的垂直高度 :$(document).scrollTop();
获取滚动条到左边的垂直宽度 :$(document).scrollLeft();

计算元素位置和偏移量


offset方法是一个很有用的方法,它返回包装集中第一个元素的偏移信息。默认情况下是相对body的偏移信息。结果包含 top和left两个属性。
offset(options, results)
options.relativeTo

指定相对计 算偏移位置的祖先元素。这个元素应该是relative或absolute定位。省略则相对body。
options.scroll

是否把 滚动条计算在内,默认TRUE
options.padding

是否把padding计算在内,默认false
options.margin

是否把margin计算在内,默认true
options.border

是否把边框计算在内,默认true

以上这篇jQuery javascript获得网页的高度与宽度就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 多种变量定义(对象直接量,数组直接量和函数直接量)
May 24 Javascript
基于jquery的$.ajax async使用
Oct 19 Javascript
file模式访问网页时iframe高度自适应解决方案
Jan 16 Javascript
使用jQuery实现input数值增量和减量的方法
Jan 24 Javascript
详细解读JavaScript的跨浏览器事件处理
Aug 12 Javascript
jQuery页面元素动态添加后绑定事件丢失方法,非 live
Jun 16 Javascript
浅谈Node.js:Buffer模块
Dec 05 Javascript
基于JavaScript实现的顺序查找算法示例
Apr 14 Javascript
vue-cli项目优化方法- 缩短首屏加载时间
Apr 01 Javascript
element-ui 的el-button组件中添加自定义颜色和图标的实现方法
Oct 26 Javascript
Vue 中使用富文本编译器wangEditor3的方法
Sep 26 Javascript
vue样式穿透 ::v-deep的具体使用
Jun 04 Javascript
JQuery给select添加/删除节点的实现代码
Apr 26 #Javascript
js计算时间差代码【包括计算,天,时,分,秒】
Apr 26 #Javascript
js 求时间差的实现代码
Apr 26 #Javascript
Bootstrap表单组件教程详解
Apr 26 #Javascript
AngularJS实现textarea记录只能输入规定数量的字符并显示
Apr 26 #Javascript
50 个 jQuery 插件可将你的网站带到另外一个高度
Apr 26 #Javascript
JS中使用apply、bind实现为函数或者类传入动态个数的参数
Apr 26 #Javascript
You might like
用php+javascript实现二级级联菜单的制作
2008/05/06 PHP
php查看请求头信息获取远程图片大小的方法分享
2013/12/25 PHP
PHP中读取文件的8种方法和代码实例
2014/08/05 PHP
PHP实现动态柱状图改进版
2015/03/30 PHP
用正则获取指定路径文件的名称
2007/02/27 Javascript
nodejs 后缀名判断限制代码
2011/03/31 NodeJs
快速查找数组中的某个元素并返回下标示例
2013/09/03 Javascript
jquery实现盒子下拉效果示例代码
2013/09/12 Javascript
Jquery ajaxStart()与ajaxStop()方法(实例讲解)
2013/12/18 Javascript
使用JS或jQuery模拟鼠标点击a标签事件代码
2014/03/10 Javascript
兼容主流浏览器的jQuery+CSS 实现遮罩层的简单代码
2014/10/14 Javascript
分享一则javascript 调试技巧
2015/01/02 Javascript
jQuery大于号(>)选择器的作用解释
2015/01/13 Javascript
详解JavaScript基于面向对象之继承
2015/12/13 Javascript
简述jQuery ajax的执行顺序
2016/01/05 Javascript
ionic 上拉菜单(ActionSheet)实例代码
2016/06/06 Javascript
node+express制作爬虫教程
2016/11/11 Javascript
纯js实现的积木(div层)拖动功能示例
2017/07/19 Javascript
ztree实现左边动态生成树右边为内容详情功能
2017/11/03 Javascript
利用JS判断客户端类型你应该知道的四种方法
2017/12/22 Javascript
详解.vue文件中style标签的几个标识符
2018/07/17 Javascript
vue 进阶之实现父子组件间的传值
2019/04/26 Javascript
ES6新增的数组知识实例小结
2020/05/23 Javascript
Python开发的HTTP库requests详解
2017/08/29 Python
python 多线程将大文件分开下载后在合并的实例
2018/11/09 Python
Python设计模式之备忘录模式原理与用法详解
2019/01/15 Python
python中not、and和or的优先级与详细用法介绍
2020/11/03 Python
Qoo10马来西亚:全球时尚和引领潮流的购物市场
2016/08/25 全球购物
用缩写的指针比较"if(p)" 检查空指针是否可靠?如果空指针的内部表达不是0会怎么样?
2014/01/05 面试题
医科大学毕业生自荐信
2014/02/03 职场文书
乡镇组织委员个人整改措施
2014/09/16 职场文书
小学生交通安全寄语
2015/02/27 职场文书
银行招聘自荐信
2015/03/06 职场文书
小学生暑假安全公约
2015/07/14 职场文书
postgresql使用filter进行多维度聚合的解决方法
2021/07/16 PostgreSQL
MySQL 条件查询的常用操作
2022/04/28 MySQL