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 相关文章推荐
为jquery.ui.dialog 增加“在当前鼠标位置打开”的功能
Nov 24 Javascript
网易JS面试题与Javascript词法作用域说明
Nov 09 Javascript
自己实现ajax封装示例分享
Apr 01 Javascript
jquery $(document).ready()和window.onload的区别浅析
Feb 04 Javascript
详解JavaScript中shift()方法的使用
Jun 09 Javascript
浅谈Angular的$q, defer, promise
Dec 20 Javascript
JS简单封装的图片无缝滚动效果示例【测试可用】
Mar 22 Javascript
jQuery操作之效果详解
May 19 jQuery
js移动端事件基础及常用事件库详解
Aug 15 Javascript
微信小程序实现上传多张图片、删除图片
Jul 29 Javascript
Vue单文件组件开发实现过程详解
Jul 30 Javascript
vue操作dom元素的3种方法示例
Sep 20 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
德劲1107的电路分析与打磨
2021/03/02 无线电
如何跨站抓取别的站点的页面的补充
2006/10/09 PHP
php_xmlhttp 乱码问题解决方法
2009/08/07 PHP
php检测网页是否被百度收录的函数代码
2013/10/09 PHP
php将url地址转化为完整的a标签链接代码(php为url地址添加a标签)
2014/01/17 PHP
php实现概率性随机抽奖代码
2016/01/02 PHP
PHP实现动态压缩js与css文件的方法
2018/05/02 PHP
在b/s开发中经常用到的javaScript技术
2006/08/23 Javascript
js 页面刷新location.reload和location.replace的区别小结
2009/12/24 Javascript
封装的jquery翻页滚动(示例代码)
2013/11/18 Javascript
IE的事件传递-event.cancelBubble示例介绍
2014/01/12 Javascript
JQuery 给元素绑定click事件多次执行的解决方法
2014/09/09 Javascript
Js 正则表达式知识汇总
2014/12/02 Javascript
JavaScript中函数声明与函数表达式的区别详解
2016/08/18 Javascript
JS获取鼠标相对位置的方法
2016/09/20 Javascript
jQuery UI仿淘宝搜索下拉列表功能
2017/01/10 Javascript
面试常见的js算法题
2017/03/23 Javascript
nodejs基于WS模块实现WebSocket聊天功能的方法
2018/01/12 NodeJs
angularjs中判断ng-repeat是否迭代完的实例
2018/09/12 Javascript
JavaScript两种计时器的实例讲解
2019/01/31 Javascript
微信小程序实现签字功能
2019/12/23 Javascript
《javascript设计模式》学习笔记一:Javascript面向对象程序设计对象成员的定义分析
2020/04/07 Javascript
浅析vue cli3 封装Svgicon组件正确姿势(推荐)
2020/04/27 Javascript
[35:34]Liquid vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
Python实现全角半角字符互转的方法
2016/11/28 Python
pandas 按照特定顺序输出的实现代码
2018/07/10 Python
Python中包的用法及安装
2020/02/11 Python
Django模板标签中url使用详解(url跳转到指定页面)
2020/03/19 Python
python访问hdfs的操作
2020/06/06 Python
企业后勤岗位职责
2014/02/28 职场文书
搞笑征婚广告词
2014/03/17 职场文书
幼儿园儿童节活动主持词+串词大全
2014/03/21 职场文书
十佳好少年事迹材料
2014/08/21 职场文书
庆国庆活动总结
2014/08/28 职场文书
资金申请报告范文
2015/05/14 职场文书
HR必备:销售经理聘用合同范本
2019/08/21 职场文书