JS獲取屏幕高度的簡(jiǎn)單實(shí)現(xiàn)代碼
主要使用了document對(duì)象關(guān)于窗口的一些屬性,這些屬性的主要功能和用法如下。
要得到窗口的尺寸,對(duì)于不同的瀏覽器,需要使用不同的屬性和方法:若要檢測(cè)窗口的真實(shí)尺寸,在netscape下需要使用window的屬性;在ie下需 要深入document內(nèi)部對(duì)body進(jìn)行檢測(cè);在dom環(huán)境下,若要得到窗口的尺寸,需要注意根元素的尺寸,而不是元素。
window對(duì)象的innerwidth屬性包含當(dāng)前窗口的內(nèi)部寬度。window對(duì)象的innerheight屬性包含當(dāng)前窗口的內(nèi)部高度。
document對(duì)象的body屬性對(duì)應(yīng)html文檔的標(biāo)簽。document對(duì)象的documentelement屬性則表示html文檔的根節(jié)點(diǎn)。
document.body.clientheight表示html文檔所在窗口的當(dāng)前高度。document.body. clientwidth表示html文檔所在窗口的當(dāng)前寬度。
js獲取屏幕高度var s = "";
s += " 網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)挘?+ document.body.clientwidth;
s += " 網(wǎng)頁(yè)可見(jiàn)區(qū)域高:"+ document.body.clientheight;
s += " 網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)挘?+ document.body.offsetwidth +" (包括邊線和滾動(dòng)條的寬)";
s += " 網(wǎng)頁(yè)可見(jiàn)區(qū)域高:"+ document.body.offsetheight +" (包括邊線的寬)";
s += " 網(wǎng)頁(yè)正文全文寬:"+ document.body.scrollwidth;
s += " 網(wǎng)頁(yè)正文全文高:"+ document.body.scrollheight;
s += " 網(wǎng)頁(yè)被卷去的高:"+ document.body.scrolltop;
s += " 網(wǎng)頁(yè)被卷去的左:"+ document.body.scrollleft;
s += " 網(wǎng)頁(yè)正文部分上:"+ window.screentop;
s += " 網(wǎng)頁(yè)正文部分左:"+ window.screenleft;
s += " 屏幕分辨率的高:"+ window.screen.height;
s += " 屏幕分辨率的寬:"+ window.screen.width;
s += " 屏幕可用工作區(qū)高度:"+ window.screen.availheight;
s += " 屏幕可用工作區(qū)寬度:"+ window.screen.availwidth;
s += " 你的屏幕設(shè)置是 "+ window.screen.colordepth +" 位彩色";
s += " 你的屏幕設(shè)置 "+ window.screen.devicexdpi +" 像素/英寸";
以上這篇JS獲取屏幕高度的實(shí)現(xiàn)代碼就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
javascript與css3動(dòng)畫(huà)結(jié)合使用小結(jié)
本文給大家講述的是如何使用javascript結(jié)合CSS動(dòng)畫(huà)來(lái)實(shí)現(xiàn)一些占用資源更少,更優(yōu)化的動(dòng)畫(huà)效果,思路十分巧妙,這里推薦給小伙伴們參考下。2015-03-03
IE11下CKEditor在Bootstrap Modal中下拉問(wèn)題的解決
這篇文章主要介紹了IE11下CKEditor在Bootstrap Modal中下拉問(wèn)題的解決方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-09-09
微信小程序template模板引入的問(wèn)題小結(jié)
這篇文章主要介紹了微信小程序template模板引入的問(wèn)題小結(jié),本文通過(guò)示例代碼給大家介紹的非常詳細(xì),感興趣的朋友跟隨小編一起看看吧2024-07-07
javascript cookie操作類的實(shí)現(xiàn)代碼小結(jié)附使用方法
javascript cookie操作類的實(shí)現(xiàn)代碼小結(jié)附使用方法,對(duì)于cookies操作不是很熟悉的朋友可以參考下。2010-06-06
element中el-switch的v-model自定義值的實(shí)現(xiàn)
在el-switch中設(shè)置active-value和inactive-value屬性,接受Boolean, String或Number類型的值,本文就來(lái)介紹一下element中el-switch的v-model自定義值的實(shí)現(xiàn),感興趣的可以了解一下2023-11-11
javascript表單驗(yàn)證使用示例(javascript驗(yàn)證郵箱)
JavaScript可用來(lái)在數(shù)據(jù)被送往服務(wù)器前對(duì)HTML表單中的這些輸入數(shù)據(jù)進(jìn)行驗(yàn)證2014-01-01

