JS 獲取屏幕、瀏覽器、頁面的高度寬度

Alan 發布于2019-08-20 18:28 / 1585人閱讀

摘要：即屏幕高度減去上下任務欄后的高度，可表示為軟件最大化時的高度。瀏覽器內頁面可用高度此高度包含了水平滾動條的高度若存在。可表示為瀏覽器當前寬度去除瀏覽器邊框后的寬度。頁面信息總高度。展示的高度表示在瀏覽器內顯示的區域高度。

（草稿）

屏幕信息

screen.height ：屏幕高度。

screen.width ：屏幕寬度。

screen.availHeight ：屏幕可用高度。即屏幕高度減去上下任務欄后的高度，可表示為軟件最大化時的高度。

screen.availWidth ：屏幕可用寬度。即屏幕寬度減去左右任務欄后的寬度，可表示為軟件最大化時的寬度。

任務欄高/寬度 ：可通過屏幕高/寬度減去屏幕可用高/寬度得出。如：任務欄高度 = screen.height - screen.availHeight

瀏覽器信息

window.outerHeight ：瀏覽器高度。

window.outerWidth ：瀏覽器寬度。

window.innerHeight ：瀏覽器內頁面可用高度；此高度包含了水平滾動條的高度(若存在)。可表示為瀏覽器當前高度去除瀏覽器邊框、工具條后的高度。

window.innerWidth ：瀏覽器內頁面可用寬度；此寬度包含了垂直滾動條的寬度(若存在)。可表示為瀏覽器當前寬度去除瀏覽器邊框后的寬度。

工具欄高/寬度 ：包含了地址欄、書簽欄、瀏覽器邊框等范圍。如：高度，可通過瀏覽器高度 - 頁面可用高度得出，即：window.outerHeight - window.innerHeight。

頁面信息

body.offsetHeight ：body總高度。

body.offsetWidth ：body總寬度。

body.clientHeight ：body展示的高度；表示body在瀏覽器內顯示的區域高度。

body.clientWidth ：body展示的寬度；表示body在瀏覽器內顯示的區域寬度。

滾動條高度/寬度 ：如高度，可通過瀏覽器內頁面可用高度 - body展示高度得出，即window.innerHeight - body.clientHeight

參見：HTML 獲取屏幕、瀏覽器、頁面的高度寬度

云服務器 GPU云服務器 js獲取屏幕高度屏幕高度寬度 js 獲取控件的寬度獲取頁面高度

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/84554.html

關于JS、JQ獲取可視區域的高度、寬度以及屏幕分辨率的那些事

摘要：用和獲取相關屬性網頁可見區域寬網頁可見區域高網頁可見區域寬包括邊框的寬網頁可見區域高包括邊框的高網頁正文全文寬網頁正文全文高網頁下滑的距離網頁左滑的距離屏幕分辨率的高屏幕分辨率的寬屏幕可用工作區的高屏幕可用工作區的高瀏覽器可視區域的內寬度，用JS和JQ獲取相關屬性 JavaScript document.body.clientWidth;//網頁可見區域寬document.body....

or0fun 2019-08-21 11:35 評論0 收藏0
移動web開發問題和經驗總結

摘要：的事件默認綁在上的抓包瀏覽器連接安卓機測試實用網站適配測試兼容性網站前端開發雅虎條優化準則前言這里大部分是自己遇到過的情況，還有一部分借鑒了同行的文章，如果大家有遇到其它坑，歡迎提出來一起研究。知識要點 1. Meta標簽 1.禁止用戶縮放頁面，頁面強制讓文檔的寬度與設備的寬度保持1:1 2.禁止ios上自動識別電話 3.禁止android上自動識別郵箱 4.針對ios上的...

MorePainMoreGain 2019-08-02 16:02 評論0 收藏0
移動web開發問題和經驗總結

摘要：的事件默認綁在上的抓包瀏覽器連接安卓機測試實用網站適配測試兼容性網站前端開發雅虎條優化準則前言這里大部分是自己遇到過的情況，還有一部分借鑒了同行的文章，如果大家有遇到其它坑，歡迎提出來一起研究。知識要點 1. Meta標簽 1.禁止用戶縮放頁面，頁面強制讓文檔的寬度與設備的寬度保持1:1 2.禁止ios上自動識別電話 3.禁止android上自動識別郵箱 4.針對ios上的...

yexiaobai 2019-08-30 14:14 評論0 收藏0
移動web開發問題和經驗總結

摘要：的事件默認綁在上的抓包瀏覽器連接安卓機測試實用網站適配測試兼容性網站前端開發雅虎條優化準則前言這里大部分是自己遇到過的情況，還有一部分借鑒了同行的文章，如果大家有遇到其它坑，歡迎提出來一起研究。知識要點 1. Meta標簽 1.禁止用戶縮放頁面，頁面強制讓文檔的寬度與設備的寬度保持1:1 2.禁止ios上自動識別電話 3.禁止android上自動識別郵箱 4.針對ios上的...

Wildcard 2019-08-22 15:44 評論0 收藏0