在日常的项目中经常需要获取屏幕的宽度或者高度，简单记录一下： Javascript方法获取： document.body.clientWidth //网页可见区域宽 document.body.clientHeight...window.screen.availWidth //屏幕可用工作区宽度 JQuery方法获取： ($(window).height()); //浏览器当前窗口可视区域高度 ($(document)....height()); //浏览器当前窗口文档的高度 ($(document.body).height());//浏览器当前窗口文档body的高度 ($(document.body).outerHeight...(true));//浏览器当前窗口文档body的总高度 包括border padding margin ($(window).width()); //浏览器当前窗口可视区域宽度 ($(document)....width());//浏览器当前窗口文档对象宽度 ($(document.body).width());//浏览器当前窗口文档body的宽度 ($(document.body).outerWidth(
屏幕可用工作区宽度：window.screen.availWidth HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度...scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度...offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置...--显示浏览器窗口的实际尺寸--> 浏览器窗口 的 实际高度: 浏览器窗口 的 实际宽度:...else if ((document.body) && (document.body.clientWidth)) winWidth = document.body.clientWidth; //获取窗口高度
window.screen.availWidth HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度...scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度...offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置...--显示浏览器窗口的实际尺寸--> 浏览器窗口 的 实际高度: 浏览器窗口 的 实际宽度...else if ((document.body) && (document.body.clientWidth)) winWidth = document.body.clientWidth; //获取窗口高度
window.screen.availWidth HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度...scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度... offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置...--显示浏览器窗口的实际尺寸--> 浏览器窗口 的 实际高度: 浏览器窗口 的 实际宽度: <input...window.innerWidth; else if ((document.body) && (document.body.clientWidth)) winWidth = document.body.clientWidth; //获取窗口高度
屏幕可用工作区宽度： window.screen.availWidth HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度...scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度...offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置...--显示浏览器窗口的实际尺寸--> 浏览器窗口 的 实际高度: 浏览器窗口 的 实际宽度...else if ((document.body) && (document.body.clientWidth)) winWidth = document.body.clientWidth; //获取窗口高度
屏幕可用工作区宽度： window.screen.availWidth HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度...scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度... offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置...--显示浏览器窗口的实际尺寸--> 12 浏览器窗口 的 实际高度: 13 浏览器窗口 的...else if ((document.body) && (document.body.clientWidth)) 25 winWidth = document.body.clientWidth; 26 //获取窗口高度
用 js 代码 window.screen.availHeight 可以取屏幕的高度，然后拼凑内容来让页面满屏显示。...但是不同手机浏览器有自己的地址栏、状态栏等，window.screen.availHeight 取到的屏幕高度也包括了这两者，导至本来希望满屏显示的内容出现滚动条，需要滑动才能看到。 ...怎么才能让页面在任何手机浏览器上都能满屏显示呢？... } return { pageWidth: pageWidth, pageHeight: pageHeight } } 也可以利用 meta 标签让浏览器直接全屏
窗口大小 跨浏览器确定一个窗口的大小不是一件容易的事。...在IE9+、Safari和Firefox中，outerWidth 和 outerHeight 返回浏览器窗口本身的尺寸（无论是从最外层的window对象还是从某个框架访问）。...在Chrome中， outerWidth 、 outerHeight 与 innerWidth 、 innerHeight 返回的值相同，即视口（viewport）大小而非浏览器窗口大小。...IE8及更早版本没有提供取得当前浏览器窗口尺寸的属性，不过它通过DOM提供了页面可见区域的相关信息。...移动IE浏览器不支持这些属性，但通过 document.documentElement.clientWidth 和 document.documentElement.clientHeihgt 提供了相同的信息
超级简单的方法，也不用写什么判断浏览器高度、宽度啥的。 下面的两种方法自选其一就行了。一个是放在和iframe同页面的，一个是放在test.html页面的。 注意别放错地方了哦。...iframe id="main" src="test.html" width="700" height="300" frameborder="0" scrolling="auto"> jquery...window.parent.document).find("#main"); var thisheight = $(document).height()+30; main.height(thisheight); }); jquery
iframe.height = h - offsetTop; // 这里 offsetTop可以替换成一个比较合理的常量值 }); } 说明： window.innerHeight 获取浏览器窗口的高度...-去掉浏览器地址栏，书签栏的可视区域的高度，包括横向滚动条的高度。...document.documentElement.clientHeight - 获取文档html根节点的高度，不包括横向滚动条的高度，其值等于window.innerHeight - 横向滚动条高度(如果有的话...)，否则等于window.innerHeight document.body.clientHeight 获取body节点的的高度，不包括横向滚动条的高度。.../** * 浏览器窗口大小发生变化时，自动调整iframe页面高度 * 浏览器等因素导致改变浏览器窗口大小时，会发生多次resize事件，导致频繁调用changeFrameHeight() */ $(
contentStyleObj: { height: "", overflow: "auto" } methods中： getHeight() { // 获取浏览器高度...768 1080一般笔记本浏览器高度 if (window.innerHeight < 768 || window.innerHeight < 1080) { this.contentStyleObj.height..."361px"; } else { this.contentStyleObj.height = "auto"; } }, created中 // 监听浏览器高度事件...window.addEventListener("resize", this.getHeight); // 执行浏览器高度事件 this.getHeight(); destroyed
window.screenTop 网页正文部分左：window.screenLeft 屏幕分辨率的高：window.screen.height 屏幕分辨率的宽：window.screen.width 屏幕可用工作区高度
在写js的时候偶尔需要获取各种高度，比如；浏览器高度，页面高度，滚动高度等。抽空整理了我自己常用到的，时间仓促，没有考虑到万恶的IE浏览器。。。。...获取屏幕的高度和宽度（屏幕分辨率）： window.screen.height window.screen.width 获取屏幕工作区域的高度和宽度（去掉状态栏）： window.screen.availHeight...window.screen.availWidth 网页全文的高度和宽度： document.body.scrollHeight document.body.scrollWidth 滚动条卷上去的高度和向右卷的宽度...： document.body.scrollTop document.body.scrollLeft 网页可见区域的高度和宽度（不加边线）： document.body.clientHeight document.body.clientWidth...网页可见区域的高度和宽度（加边线）： document.body.offsetHeight document.body.offsetWidth
如果你要获取的样式没有相对应的（就像#div1.style.width对 应#div1.offsetWidth），就只能分别针对不用浏览器来获取样式表的属性了，可以试着搜索“JS 获取样式属性”之类的。...原文：http://www.cnblogs.com/zhwl/p/3858682.html 实际测试过程中，发现上面获取真实高度是有问题，其实无论是设置在样式表还是在行内设置，都会获取到你设置的值，如果要获取真实高度...这里还附带其它的获取高度方法 alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度...alert($(document.body).height());//浏览器当前窗口文档body的高度 alert($(document.body).outerHeight(true));//浏览器当前窗口文档...;//浏览器当前窗口文档对象宽度 alert($(document.body).width());//浏览器当前窗口文档body的高度 alert($(document.body).outerWidth
$(“your selector”).prop(“scrollHeight”); 其他操作： $(window).height(); //浏览器当前窗口可视区域高度 $(document).height...(); //浏览器当前窗口文档的高度 $(document.body).height();//浏览器当前窗口文档body的高度 $(document.body).outerHeight(true);/.../浏览器当前窗口文档body的总高度 包括border padding margin $(window).width(); //浏览器当前窗口可视区域宽度 $(document).width();/.../浏览器当前窗口文档对象宽度 $(document.body).width();//浏览器当前窗口文档body的高度 $(document.body).outerWidth(true);//浏览器当前窗口文档...，才等于 scrollHeight 高度。
iframe 是一个非常迷得一个元素，很难直接获取其内部元素的高度。...下面分享一个方法，可以获取 iframe 内部元素的高度： function setIframeHeight(id){ try{ var iframe = document.getElementById
// 网页可见区域(body)的宽度，包括border，margin等像素值 document.body.offsetHeight // 网页可见区域(body)的高度...window.screen.availWidth; //屏幕可用工作区的宽 document.documentElement.scrollHeight // 文档的高度...滚动条到底部的时候关系： clientHeight + scrollTop = scrollHeight 客户端高度 + 滚动上去的高度 = 可滚动高度（文档高度） 那么上拉加载的效果... //...获取数据，追加到网页 function getImages(pageNum){ $(".cover").show(); $.get(''+pageNum, function(data,
jquery监听浏览器刷新 基本代码段，用于在使用JavaScript调整浏览器大小的情况下刷新页面 。...this.location.reload(false); /* false to get page from cache */ }, 200); }); 翻译自: https://www.sitepoint.com/jquery-refresh-page-browser-resize.../ jquery监听浏览器刷新 发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/161187.html原文链接：https://javaforall.cn
clientHeight：包括padding但不包括border、水平滚动条、margin的元素的高度。对于inline的元素这个属性一直是0，单位px，只读元素。...style.height //返回元素的高度（包括元素高度，不包括内边距、边框和外边距） clientHeight //返回元素的高度（包括元素高度、内边距，不包括边框和外边距） offsetHeight...//返回元素的高度（包括元素高度、内边距和边框，不包括外边距） scrollHeigh //返回元素的高度（包括元素高度、内边距和溢出尺寸，不包括边框和外边距），无溢出的情况，与clientHeight...相同 scrollTop //此属性可以获取或者设置对象的最顶部到对象在当前窗口显示的范围内的顶边的距离，也就是元素滚动条被向下拉动的距离。...offsetTop //返回元素的上外缘距离最近采用定位父元素内壁的距离，如果父元素中没有采用定位的，则是获取上外边缘距离文档内壁的距离。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM
