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)文章
看CSDN上別人的代碼，感覺比較精煉，拿來主義,需要的朋友可以看下。2009-08-08
深入理解JS中attribute和property的區(qū)別
property 和 attribute非常容易混淆，但實際上，二者是不同的東西，屬于不同的范疇，本文就詳細(xì)的介紹一下JS中attribute和property的區(qū)別 ，感興趣的可以了解一下2022-02-02
這篇文章主要給大家介紹了關(guān)于微信小程序中網(wǎng)絡(luò)請求緩存的解決方法，文中通過示例代碼介紹的非常詳細(xì)，對大家學(xué)習(xí)或者使用微信小程序具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12
圖片懶加載是日常開發(fā)會經(jīng)常使用的一個功能,但是在日常中可能使用v-lazy便直接實現(xiàn)了圖片懶加載,但是本文將通過原生js來實現(xiàn)一下圖片懶加載的功能，感興趣的同學(xué)跟著小編一起來看看吧2023-07-07
csdn 博客中實現(xiàn)運行代碼功能實現(xiàn)
有時候因為csdn的博客經(jīng)常處理一些字符，導(dǎo)致代碼很多情況下，都不能正常運行，給大家的閱讀帶來了麻煩，下面是腳本之家編輯簡單的整理下。2009-08-08
這里向大家描述一下JS操作css的float屬性的特殊寫法，使用js操作css屬性的寫法是有一定的規(guī)律的，對于沒有中劃線的css屬性一般直接使用style.屬性名即可2007-08-08
下面小編就為大家?guī)硪黄仙Ｕ?js中this的指向。小編覺得挺不錯的， 現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-06-06
這篇文章主要為大家詳細(xì)介紹了javascript實現(xiàn)貪吃蛇思路小游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
JS函數(shù)參數(shù)的傳遞與同名參數(shù)實例分析
這篇文章主要介紹了JS函數(shù)參數(shù)的傳遞與同名參數(shù),結(jié)合實例形式分析了JS函數(shù)參數(shù)的傳遞與同名參數(shù)相關(guān)原理、使用技巧與操作注意事項,需要的朋友可以參考下2020-03-03
這篇文章主要介紹了JavaScript之移動端H5生成圖片解決方案講解,本篇文章通過簡要的案例,講解了該項技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-08-08