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 相关文章推荐
javascript 面向对象思想 附源码
Jul 07 Javascript
jQuery的Ajax的自动完成功能控件简要说明
Feb 22 Javascript
web网页按比例显示图片实现原理及js代码
Aug 09 Javascript
简单的邮箱登陆的提示效果类似于yahoo邮箱
Feb 26 Javascript
详解js中的apply与call的用法
Jul 30 Javascript
原生态js,鼠标按下后,经过了那些单元格的简单实例
Aug 11 Javascript
js实现表格筛选功能
Jan 18 Javascript
javascript history对象详解
Feb 09 Javascript
jQuery实现定时隐藏对话框的方法分析
Feb 12 jQuery
在JS循环中使用async/await的方法
Oct 12 Javascript
JS中getElementsByClassName与classList兼容性问题解决方案分析
Aug 07 Javascript
Vue页面渲染中key的应用实例教程
Jan 12 Vue.js
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
星际玩家的三大定律
2020/03/04 星际争霸
收音机玩机评测 406 篇视频合集
2020/03/11 无线电
自己在做项目过程中学到的PHP知识收集
2012/08/20 PHP
PHP中iconv函数知识汇总
2015/07/02 PHP
PHP架构及原理知识点详解
2019/12/22 PHP
Aster vs KG BO3 第一场2.19
2021/03/10 DOTA
基于Jquery的动态添加控件并取值的实现代码
2010/09/24 Javascript
鼠标事件延时切换插件
2011/03/12 Javascript
javascript学习笔记(十八) 获得页面中的元素代码
2012/06/20 Javascript
JS实现拖动示例代码
2013/11/01 Javascript
JavaScript导航脚本判断当前导航
2016/07/12 Javascript
jQuery图片轮播(二)利用构造函数和原型创建对象以实现继承
2016/12/06 Javascript
JavaScript设计模式之单例模式原理与用法实例分析
2018/07/26 Javascript
AJAX在JQuery中的应用详解
2019/01/30 jQuery
Vue 3.0 前瞻Vue Function API新特性体验
2019/08/12 Javascript
javascript实现左右缓动动画函数
2020/11/25 Javascript
在Vue中使用CSS3实现内容无缝滚动的示例代码
2020/11/27 Vue.js
Django1.7+python 2.78+pycharm配置mysql数据库教程
2014/11/18 Python
Python 遍历子文件和所有子文件夹的代码实例
2016/12/21 Python
python爬虫框架scrapy实战之爬取京东商城进阶篇
2017/04/24 Python
python3+PyQt5+Qt Designer实现堆叠窗口部件
2018/04/20 Python
python 顺时针打印矩阵的超简洁代码
2018/11/14 Python
django orm 通过related_name反向查询的方法
2018/12/15 Python
python保存log日志,实现用log日志画图
2019/12/24 Python
Python实现发票自动校核微信机器人的方法
2020/05/22 Python
Python安装Bs4的多种方法
2020/11/28 Python
CSS3 RGBA色彩模式使用实例讲解
2016/04/26 HTML / CSS
HealthElement海外旗舰店:新西兰大卖场
2018/02/23 全球购物
The Athlete’s Foot新西兰:新西兰最大的运动鞋零售商
2019/12/23 全球购物
夜大毕业生自我鉴定
2013/10/31 职场文书
党员群众路线对照检查材料
2014/08/31 职场文书
乡镇党委书记第三阶段个人整改措施
2014/09/16 职场文书
店铺转让协议书
2015/01/29 职场文书
Spring Cache和EhCache实现缓存管理方式
2021/06/15 Java/Android
vmware虚拟机打不开vmx文件怎么办 ?vmware虚拟机vmx文件打开方法
2022/04/08 数码科技
Vue操作Storage本地化存储
2022/04/29 Vue.js