52AV手機A片王|52AV.ONE
標題:
取得目前可見視窗內容的尺寸--Javascript
[打印本頁]
作者:
media
時間:
2014-12-10 17:42
標題:
取得目前可見視窗內容的尺寸--Javascript
本帖最後由 media 於 2014-12-10 19:08 編輯
1 h. J4 [* x/ u- z( n% s& z
* K7 k3 k! ?/ S7 O0 v# Q' N" S
最近用javascript取視窗的大小時,遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼,當用於點圖放大並顯示於前景中央位置時非常有用。
- A: a3 L6 Q e
<script type="text/javascript">
3 n: `. S3 u2 n9 T
<!--
9 D/ {! X4 X- U$ F7 L1 P
: G. j5 B( f. S4 G, r
var viewportwidth;
. D O+ [4 \ S
var viewportheight;
% r2 e8 P$ V5 {! @8 w7 p
) L% y3 k6 X0 D! ~
// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
. i% \/ _4 t3 k3 r8 j. ]$ h- O
! E1 B" O+ k/ X2 ^$ f6 N7 S
if (typeof window.innerWidth != 'undefined')
8 a5 k _* s6 @* g
{
! C4 {, W7 J% N1 L' Y( L& i! {+ i
viewportwidth = window.innerWidth,
& G* D# |# t8 Z; w a' m5 G! u
viewportheight = window.innerHeight
3 T8 t) ~% n! q
}
' ~+ |4 X# C) [" x2 N
1 l* q, e; ~- u4 l. s9 s
// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
/ `& @3 o- ~$ b" [ a$ ]& [/ a
* g `6 Y2 G+ R4 H; Z( K" D
else if (typeof document.documentElement != 'undefined'
# C1 k. @0 s% A7 d( j" K5 X& k
&& typeof document.documentElement.clientWidth !=
: v* s5 g0 l; n/ ^
'undefined' && document.documentElement.clientWidth != 0)
: W7 w6 o [/ w! A
{
4 B' L% F7 [2 z( o1 V/ X4 E: }
viewportwidth = document.documentElement.clientWidth,
" F- C$ x2 D$ ]0 \) w$ d2 Q% x
viewportheight = document.documentElement.clientHeight
1 j" B/ {4 Q3 D9 A3 A. B G
}
& e( o* G( i0 O' R7 t [3 B7 F
x+ \9 ]/ k: f' \. @/ V. W
// older versions of IE
2 o1 c _/ A) U/ |+ l
( }8 [& N8 g3 [( r: o
else
0 ]+ B! x9 N4 @! t# @, {; Z, N% s
{
3 y) ~9 w$ I* o; K3 m: w- [9 n
viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
2 H& t% Q) n& R6 `) a- a9 E; {
viewportheight = document.getElementsByTagName('body')[0].clientHeight
! P4 ?' S3 B! V, x
}
1 g- e/ {6 i3 e% Z6 c" `5 `
document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
; J' j3 D8 F* C7 l* {% `
//-->
' \2 @) w7 I% ?7 T
</script>
複製代碼
結果: 在google chrome 顯示結果
: S6 T* V Z7 ~% y% M' l8 P' w. v6 ?
1.png
(81.75 KB, 下載次數: 296)
下載附件
保存到相冊
2014-12-10 19:08 上傳
4 B! B+ X' m' { B
! y) {2 b4 ^2 E% T
來源:
Get viewport size (width and height) with javascript
( @+ X0 e" P1 Y# k" U
g2 U" Q) g. e; f, J% A
! J8 W0 e0 A5 ^; X
歡迎光臨 52AV手機A片王|52AV.ONE (https://www.itech.casa/)
Powered by Discuz! X3.2