javacript獲取當(dāng)前屏幕大小
在使用html5在android下做開發(fā)的時候,要獲取屏幕實際的大小,直接上代碼,可以通過如下代碼測試。
<script>
function a(){
document.write(
"屏幕分辨率為:"+screen.width+"*"+screen.height
+"<br />"+
"屏幕可用大?。?+screen.availWidth+"*"+screen.availHeight
+"<br />"+
"網(wǎng)頁可見區(qū)域?qū)挘?+document.body.clientWidth
+"<br />"+
"網(wǎng)頁可見區(qū)域高:"+document.body.clientHeight
+"<br />"+
"網(wǎng)頁可見區(qū)域?qū)?包括邊線的寬):"+document.body.offsetWidth
+"<br />"+
"網(wǎng)頁可見區(qū)域高(包括邊線的寬):"+document.body.offsetHeight
+"<br />"+
"網(wǎng)頁正文全文寬:"+document.body.scrollWidth
+"<br />"+
"網(wǎng)頁正文全文高:"+document.body.scrollHeight
+"<br />"+
"網(wǎng)頁被卷去的高:"+document.body.scrollTop
+"<br />"+
"網(wǎng)頁被卷去的左:"+document.body.scrollLeft
+"<br />"+
"網(wǎng)頁正文部分上:"+window.screenTop
+"<br />"+
"網(wǎng)頁正文部分左:"+window.screenLeft
+"<br />"+
"屏幕分辨率的高:"+window.screen.height
+"<br />"+
"屏幕分辨率的寬:"+window.screen.width
+"<br />"+
"屏幕可用工作區(qū)高度:"+window.screen.availHeight
+"<br />"+
"屏幕可用工作區(qū)寬度:"+window.screen.availWidth
);
}
</script>
<body onload="a()" >
</body>
</html>
HTML精確定位:scrollLeft,scrollWidth,clientWidth,offsetWidth
scrollHeight: 獲取對象的滾動高度。
scrollLeft:設(shè)置或獲取位于對象左邊界和窗口中目前可見內(nèi)容的最左端之間的距離
scrollTop:設(shè)置或獲取位于對象最頂端和窗口中可見內(nèi)容的最頂端之間的距離
scrollWidth:獲取對象的滾動寬度
offsetHeight:獲取對象相對于版面或由父坐標(biāo) offsetParent 屬性指定的父坐標(biāo)的高度
offsetLeft:獲取對象相對于版面或由 offsetParent 屬性指定的父坐標(biāo)的計算左側(cè)位置
offsetTop:獲取對象相對于版面或由 offsetTop 屬性指定的父坐標(biāo)的計算頂端位置
event.clientX 相對文檔的水平座標(biāo)
event.clientY 相對文檔的垂直座標(biāo)
event.offsetX 相對容器的水平坐標(biāo)
event.offsetY 相對容器的垂直坐標(biāo)
document.documentElement.scrollTop 垂直方向滾動的值
event.clientX+document.documentElement.scrollTop 相對文檔的水平座標(biāo)+垂直方向滾動的量
IE,F(xiàn)ireFox 差異如下:
IE6.0、FF1.06+:
clientWidth = width + padding
clientHeight = height + padding
offsetWidth = width + padding + border
offsetHeight = height + padding + border
IE5.0/5.5:
clientWidth = width - border
clientHeight = height - border
offsetWidth = width
offsetHeight = height
(需要提一下:CSS中的margin屬性,與clientWidth、offsetWidth、clientHeight、offsetHeight均無關(guān))
網(wǎng)頁可見區(qū)域?qū)挘?document.body.clientWidth
網(wǎng)頁可見區(qū)域高: document.body.clientHeight
網(wǎng)頁可見區(qū)域?qū)挘?document.body.offsetWidth (包括邊線的寬)
網(wǎng)頁可見區(qū)域高: document.body.offsetHeight (包括邊線的高)
網(wǎng)頁正文全文寬: document.body.scrollWidth
網(wǎng)頁正文全文高: document.body.scrollHeight
網(wǎng)頁被卷去的高: document.body.scrollTop
網(wǎng)頁被卷去的左: document.body.scrollLeft
網(wǎng)頁正文部分上: window.screenTop
網(wǎng)頁正文部分左: window.screenLeft
屏幕分辨率的高: window.screen.height
屏幕分辨率的寬: window.screen.width
屏幕可用工作區(qū)高度: window.screen.availHeight
屏幕可用工作區(qū)寬度: window.screen.availWidth
以上就是使用javacript獲取當(dāng)前屏幕大小的全部內(nèi)容,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
JSON.parse()和JSON.stringify()使用介紹
這篇文章主要介紹了JSON.parse()和JSON.stringify()使用,需要的朋友可以參考下2014-06-06JavaScript 判斷iPhone X Series機型的方法
這篇文章主要介紹了JavaScript 判斷iPhone X Series機型的方法,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2019-01-01手淘flexible.js框架使用和源代碼講解小結(jié)
手淘框架是一個用來適配移動端的js框架,這篇文章主要介紹了手淘flexible.js框架使用和源代碼講解小結(jié),具有一定的參考價值,感興趣的小伙伴們可以參考一下2018-10-10