52AV手機A片王|52AV.ONE
標題:
取得目前可見視窗內容的尺寸--Javascript
[打印本頁]
作者:
media
時間:
2014-12-10 17:42
標題:
取得目前可見視窗內容的尺寸--Javascript
本帖最後由 media 於 2014-12-10 19:08 編輯
- _, q5 E& z6 J
* v% T* v; k/ Y1 P4 E7 e( \! k
最近用javascript取視窗的大小時,遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼,當用於點圖放大並顯示於前景中央位置時非常有用。
% Y h9 `" R7 q4 j
<script type="text/javascript">
2 r x2 B Y8 s6 E' I3 H, q3 q. L1 }& N
<!--
( Q: W6 Z3 x' y% h. B
. b6 f+ G+ C# r1 ^
var viewportwidth;
6 H& y& ]$ R4 \- [2 P
var viewportheight;
( i- F- L/ ?. U% y1 Y4 \+ ^
+ W) Q- s3 m. P- _: g. f- i
// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
: C6 Y; o4 J* ?" q c# I# b; `& N
. O2 h) e# i v$ H
if (typeof window.innerWidth != 'undefined')
4 E* g; g7 e3 u+ p9 q
{
, C) _- { D5 A
viewportwidth = window.innerWidth,
, G# J& q* P: z0 Q; r, M
viewportheight = window.innerHeight
& [8 s: W9 }- S2 u% H9 R, O# B
}
! p" B/ b: }" m ?7 r9 d, m
) n; N9 e+ {" E2 P& m
// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
; Y1 h5 U# `2 h; ]
; q6 f/ v8 U9 Z& x6 C
else if (typeof document.documentElement != 'undefined'
$ A* J- g- k0 A! D5 m
&& typeof document.documentElement.clientWidth !=
% x' y! A. S4 e: ` @; U* q" g2 b
'undefined' && document.documentElement.clientWidth != 0)
5 u4 L1 H {& U
{
6 r7 Q" P" L* j& z" J
viewportwidth = document.documentElement.clientWidth,
$ \4 [1 J! [5 K7 A9 ~- j- b. F
viewportheight = document.documentElement.clientHeight
- B5 N6 E7 s# {
}
* p( {! U: ?9 i7 i3 \
; A( _! j2 L ? N7 j- p( C1 Q8 @
// older versions of IE
7 a, ]4 C/ x4 U/ ]
5 u0 Q* F& Q' |" O
else
2 Q. U. b2 i/ i1 g8 M# g' M" |, q
{
! s( K/ b; p6 y8 j/ i
viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
8 R1 M( R8 t3 ~" J- I
viewportheight = document.getElementsByTagName('body')[0].clientHeight
k: B: q9 ?, x9 R
}
3 X' f( g$ H' S0 q* g* W
document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
; G3 ^. u5 r; E' M
//-->
) {5 J1 L& G% w P; j
</script>
複製代碼
結果: 在google chrome 顯示結果
- k+ N0 D8 o" P; [1 H8 _, a1 B
1.png
(81.75 KB, 下載次數: 322)
下載附件
保存到相冊
2014-12-10 19:08 上傳
, N1 I3 C2 e. x1 M" E
: X1 L4 j- |+ q' ^/ {& q2 B
來源:
Get viewport size (width and height) with javascript
, u2 f/ v: P' x/ o/ L" W
' R9 L ], {( l
% `5 w, y* g. Y
歡迎光臨 52AV手機A片王|52AV.ONE (https://www.52av.one/)
Powered by Discuz! X3.2