jQuery 获取页面宽高
无滚动条的情况下(页面宽高比可视区域小):
$(document)和$(window)的width、height方法获取的值都是一样的,都是可视区域的宽高
即$(document).width()==$(window).width() $(document).height()==$(window).height()
有垂直滚动条的情况下(页面高度比可视区域高):
比如,可视区域高度638px,而页面实际高度为900或更多,超出可视区域高度,会出现垂直滚动条
那么$(document)和$(window)的height方法获取的值为页面实际的高度800,而不是638px
$(document)和$(window)的width方法获取的值都是一致的,都是可视区域的宽度(不包含滚动条的宽度)
有水平滚动条的情况下(页面宽度比可视区域更宽):
比如,可视区域宽度1366,而某个元素宽度为2000,超出可视区域宽度,会出现水平滚动条
那么$(document).width()方法获取的值为页面实际的宽度,也就是2000,而$(window).width()获取的是可视区域的宽度1366,如果浏览器窗口变小了,那么这个值也会变,但$(document).width()还是为2000
$(document)和$(window)的height方法随可视区域高度变化而变化,都是一样的(不包含滚动条的宽度)
都存在的情况下(页面大小比可视区域更大):
比如,可视区域宽度1366 高度638,而页面宽度2000 高度900,超出可视区域,会出现水平滚动条及垂直滚动条
那么$(document)和$(window)的height方法获取的值为页面实际的高度800,而不是638px
$(document)和$(window)的width方法获取的值都是一致的,都是可视区域的宽度(不包含滚动条的宽度)
$(document).width()方法获取的值为页面实际的宽度,也就是2000,而$(window).width()获取的是可视区域的宽度1366,如果浏览器窗口变小了,那么这个值也会变,但$(document).width()还是为2000
jQuery 获取页面宽高的更多相关文章
- JQUERY获取loaded 宽高这么变态
JQUERY获取loaded 宽高这么变态: $('<img/>').attr('src',img.src).load(function() { img.Owidth = $(this). ...
- javascript 常用获取页面宽高信息 API
在页面的构建中 常常会需要获取页面的一些宽高信息,例如实现 惰性加载图片 需要获取页面的可见区域高度 和 已滚动区域的高度,以判断图片所在位置是否可见来决定加载图片的时间, 花点时间整理了一下,获取页 ...
- jq弹窗(获取页面宽高,滚轮高度,始终居中)
jq写一个弹窗,效果如上图所示, 点击按钮弹窗弹出,右上角关闭. 弹窗始终显示在页面中间,无论放大缩小窗口,滚轮滚动. 代码如下: html: <br><br><br&g ...
- js获取页面宽高
网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offsetWidth ...
- jquery获取浏览器宽高
满足获取各种高的需求 $(document).ready(function() { alert($(window).height()); //浏览器时下窗口可视区域高度 alert($(documen ...
- jquery 获取图片宽高为0的问题
原理:页面加载完了,图片不一定加载完了. $(function(){ $("img").on("load",function(){ //核心 var w = $ ...
- [Jquery] Jquery获取浏览器宽高的代码
<script type="text/javascript"> $(document).ready(function() { alert($(window).heigh ...
- JavaScript、jQuery获取页面及个元素高度、宽度
Javascript获取获取屏幕.浏览器窗口 ,浏览器,网页高度.宽度的大小网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.client ...
- android中加载的html获取的宽高不正确
wap页面使用 js库是zepto,按照惯例在$(function(){})中,来获取当前可视区的宽高,但得到的宽高却与预想的相差十万八千里. 原本android手机的浏览器设定的宽高基本是360*6 ...
随机推荐
- 支付宝小程序serverless---获取用户信息(头像)并保存到云数据库
支付宝小程序serverless---获取用户信息(头像)并保存到云数据库 博客说明 文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人删除,谢谢! 我又 ...
- H - Buy Tickets POJ - 2828 逆序遍历 树状数组+二分
H - Buy Tickets POJ - 2828 这个题目还是比较简单的,其实有思路,不过中途又断了,最后写了一发别的想法的T了. 然后脑子就有点糊涂,不应该啊,这个题目应该会写才对,这个和之前的 ...
- kafka简介及集群部署
消息队列概念:(Message queue): “消息”是在两台计算机间传送的数据单位.消息可以非常简单,例如只包含文本字符串:也可以更复杂,可能包含嵌入对象. “消息队列”是在消息的传输过程中保存消 ...
- CSS 块元素、内联元素、内联块元素三者的区别与转换
三种元素 块元素 内联元素 内联块元素 元素之间的转换 三种元素 元素就是标签,布局中常用的有三种标签,块元素.内联元素.内联块元素. 了解这三种元素的特性,才能熟练的进行页面布局. 块元素 块元素, ...
- 【Hadoop离线基础总结】伪分布模式环境搭建
伪分布模式环境搭建 服务规划 适用于学习测试开发集群模式 步骤 第一步:停止单节点集群,删除/export/servers/hadoop-2.7.5/hadoopDatas,重新创建文件夹 停止单节点 ...
- js数据类型很简单,却也不简单
最近脑子里有冒出"多看点书"的想法,但我个人不是很喜欢翻阅纸质书籍,另一方面也是因为我能抽出来看书的时间比较琐碎,所以就干脆用app看电子书了(如果有比较完整的阅读时间,还是建议看 ...
- Code Review 常见的5个错误模式
原作者:Trisha Gee Code Review 的时候,每个人都会关心最佳实践,但最坏的实践有时可能会更有启示意义. Code Review是研发团队必不可少的,但并不总是正确的.这篇文章指出了 ...
- [hdu5195]线段树
题意:给一个DAG,最多可以删去k条边,求字典序最大的拓扑序列.思路:贪心选取当前可选的最大编号即可,同时用线段树维护下.一个节点可以被选,当且仅当没有指向它的边. #include <iost ...
- JS理论--正则表达式RegExp的创建、元字符、优先度、方法(test(),exec(),match(),replace())
实战,参数可以对照上面的,代码一定要敲 var str = 'abc123cba456aaa789'; var reg = /\d+/g; console.log(reg.test(str)) //s ...
- 基于Redis的Nginx服务器集群session共享
原料:jdk1.8,tomcat7,nginx1.16,Redis3.2.100,Redis-Tomcat需要的jar包,基于windows7. Redis3.2.100与Redis-Tomcat需要 ...