手机版

浏览器高度窗口中获取高度元素大小偏移属性的js方法

时间:2021-09-11 来源:互联网 编辑:宝哥软件园 浏览:

如下图所示:

Screen.widthscreen.heightscreen.availheight//get移除状态栏后的屏幕高度。screen.availWidth //获取移除状态栏后的屏幕高度。

第二,获取浏览器窗口内容的大小。

//高度window . inner height | | document . document element . client height | | document.body.clientHeight//宽度window . inner width | | document . document element . client width | |由Document.documentelement.clientwidth支持* * window.innerheightff/ch,获取窗口大小。* document.documentelement.clientheightie/ch支持* document.body.client通过body元素获得内容的大小*/iii。滚动条支持的区别。

对于没有任何滚动条变化的页面,Firefox/IE默认情况下认为HTML元素具有滚动条属性。而身体没有。

Chrome认为正文具有滚动条属性。

因此,兼容性编写如下:

document . document element . scroll top | | document . body . scroll top IV。获取元素的维度。

Elemnt.offsetWidthelemnt.offsetHeight//只有IE5不支持。请随意使用。插图:

* offsetWidth可以获取元素的高度尺寸,包括:宽度填充[左,右]边框[左,右]

* offsetHeight可以获取元素的宽度尺寸,包括:高度填充[顶部,底部]底部[顶部,底部]

动词(verb的缩写)元素的偏移属性

Element.offsetTop //获取元素与其偏移引用父元素顶部之间的距离. offsetLeft //获取元素与其偏移引用父元素左侧之间的距离. offsetParent //获取当前元素的引用父元素*offsetTop可以获取元素与其偏移引用父元素顶部之间的距离。包括页边距[顶部]顶部

*offsetLeft可以获取到下一个更高级别的偏移引用父元素的距离。包括:左边距

*请注意,offsetParent在IE6/7和IE8/FF/CH中存在兼容性问题:

在FF/Chrome/IE8:

如果当前元素具有定位,则偏移参照的父元素是其上层最近的定位元素。

如果当前元素没有定位,默认的引用父元素是body。

在IE6/7中:

无论是否定位,其偏移参照父元素都是其上方的父元素。

一般来说:

无论是FF/Chrome还是IE,最终引用的父元素都是body元素,所以兼容的方法是获取当前元素到body元素的偏移值。

兼容性写作

函数getOffestValue(elem){ var Far=null;var topValue=elem.offsetTopvar leftValue=elem.offsetLeftvar offset far=elem . offset parent;while(offset far){ alert(offset far . tagname)topValue=offset far . offset top;left value=offsetfar . offsetleft;Far=offsetFaroffset far=offset far . offset parent;}返回{'top' : top值,' left' : left值,' far' : far}}/* *当前元素与主体元素顶部之间的距离。*左侧当前元素到主体元素左侧的距离。* Far返回最终的引用父元素。*/以上js方法获取浏览器高度窗口高度元素的大小偏移量属性是边肖分享给大家的全部内容。希望能给大家一个参考,支持我们。

版权声明:浏览器高度窗口中获取高度元素大小偏移属性的js方法是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。