取得窗口大小 兼容所有瀏覽器的js代碼
更新時(shí)間：2011年08月09日 20:05:40 作者：
我們首先把window.innerWidth和window.innerHeight的值分別付給了pageWidth和pageHeight。
取得窗口大小的代碼：
var pageWidth = window.innerWidth,
var pageHeight = window.innerHeight;
if(typeof pageWidth != "number"){
if(document.compatMode == "number"){
pageWidth = document.documentElement.clientWidth;
pageHeight = document.documentElement.clientHeight;
}else{
pageWidth = document.body.clientWidth;
pageHeight = document.body.clientHeight;
}
}
我們首先把window.innerWidth和window.innerHeight的值分別付給了pageWidth和pageHeight。然后檢查pageWidth中保存的是不是一個(gè)數(shù)值；如果不是，則通過(guò)document.compatMode來(lái)確定頁(yè)面是否處于標(biāo)準(zhǔn)模式。如果是，則分別使用document.documentElement.clientWidth和document.documentElement.clientHeight的值。否則，就使用document.body.clientWidth和document.body.clientHeight的值。
取得窗口位置的代碼：
var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX;
var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;
這兩個(gè)例子目的是取得窗口左邊和上邊的位置，首先運(yùn)用二元操作符判斷screenLeft屬性和screenTops屬性是否存在，如果存在（在IE、Safari、Opera和Chrome中），則取這兩個(gè)屬性的值。如果不存在（在Firefox中），則取screenX和screenY的值。
復(fù)制代碼 代碼如下:
var pageWidth = window.innerWidth,
var pageHeight = window.innerHeight;
if(typeof pageWidth != "number"){
if(document.compatMode == "number"){
pageWidth = document.documentElement.clientWidth;
pageHeight = document.documentElement.clientHeight;
}else{
pageWidth = document.body.clientWidth;
pageHeight = document.body.clientHeight;
}
}
我們首先把window.innerWidth和window.innerHeight的值分別付給了pageWidth和pageHeight。然后檢查pageWidth中保存的是不是一個(gè)數(shù)值；如果不是，則通過(guò)document.compatMode來(lái)確定頁(yè)面是否處于標(biāo)準(zhǔn)模式。如果是，則分別使用document.documentElement.clientWidth和document.documentElement.clientHeight的值。否則，就使用document.body.clientWidth和document.body.clientHeight的值。
取得窗口位置的代碼：
復(fù)制代碼 代碼如下:
var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX;
var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;
這兩個(gè)例子目的是取得窗口左邊和上邊的位置，首先運(yùn)用二元操作符判斷screenLeft屬性和screenTops屬性是否存在，如果存在（在IE、Safari、Opera和Chrome中），則取這兩個(gè)屬性的值。如果不存在（在Firefox中），則取screenX和screenY的值。
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了js仿小米二級(jí)菜單顯示效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-03-03
javascript實(shí)現(xiàn)tab切換的兩個(gè)實(shí)例
這篇文章主要介紹了javascript實(shí)現(xiàn)tab切換的兩個(gè)實(shí)例，是對(duì)之前方法原理的進(jìn)一步延伸，需要深入了解的同學(xué)可以參考一下2015-11-11
css 二級(jí)菜單 實(shí)現(xiàn)代碼集合 修正版
最近的網(wǎng)站要求使用二級(jí)菜單，本著“能用別人的就用別人的，不能用別人的就用自己的”的原則，在網(wǎng)上找到一個(gè)經(jīng)典的使用CSS制作的二級(jí)菜單，感覺(jué)不錯(cuò)，先記錄下來(lái)，以備它用。2009-06-06
防止xss和sql注入:JS特殊字符過(guò)濾正則，需要的朋友可以參考一下2013-04-04
關(guān)于對(duì)async?await效率問(wèn)題的深入思考
這篇文章主要給大家介紹了關(guān)于對(duì)async?await效率問(wèn)題的深入思考,async和await要搭配Promise使用,它進(jìn)一步極大的改進(jìn)了Promise的寫法,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-01-01
本文通過(guò)實(shí)例代碼給大家介紹了JS中定位 position 的使用，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧2017-08-08
JavaScript canvas實(shí)現(xiàn)雪花隨機(jī)動(dòng)態(tài)飄落
這篇文章主要為大家詳細(xì)介紹了JavaScript canvas實(shí)現(xiàn)雪花隨機(jī)動(dòng)態(tài)飄落，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-02-02
JavaScript用Number方法實(shí)現(xiàn)string轉(zhuǎn)int
parseInt方法在format'00'開(kāi)頭的數(shù)字時(shí)會(huì)當(dāng)作2進(jìn)制轉(zhuǎn)10進(jìn)制，所以建議string轉(zhuǎn)int最好用Number方法2014-05-05
這篇文章主要介紹了javascript計(jì)算漸變顏色的實(shí)例的相關(guān)資料,希望通過(guò)本文能幫助到大家，讓大家理解掌握這部分內(nèi)容，需要的朋友可以參考下2017-09-09
這篇文章主要介紹了JavaScript基于面向?qū)ο笾^承，感興趣的小伙伴們可以參考一下2015-12-12