tid=159& 本帖最後由 media 於 2014-12-10 19:08 編輯
- A- c% y: V2 _- m8 F" w/ L, `$ Y
: {& p6 Q7 Z y3 S$ B# a' h5 T4 m最近用javascript取視窗的大小時,遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼,當用於點圖放大並顯示於前景中央位置時非常有用。
* z/ }3 q/ [; _/ @- q1 k. a9 P- <script type="text/javascript">
( i1 B, @' e8 B, ?% V6 i' R- d9 E - <!--- C2 m' Z4 c: t- z' W1 R# z9 }
7 }% Q: R z6 c% R h6 `- var viewportwidth;
/ r G6 D' o% ~' ~0 j( H - var viewportheight;8 \ U Q2 }+ y* Z, b# x
-
H+ V9 B9 o6 T* @6 K! r - // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight1 M- Y6 V" z+ x6 T. r) [/ [
- * W) G( ^8 F+ f. K) Z# L6 Q
- if (typeof window.innerWidth != 'undefined')
1 _7 |, H- @6 }) [# F* D - {2 p) A) X1 k& F& E
- viewportwidth = window.innerWidth,8 k& c$ y6 R( F
- viewportheight = window.innerHeight
+ _6 [ P6 p, v( D - }8 y7 Z- I% s2 C
- ; V, ~" Q% c- h# _, b+ V
- // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
1 L4 z0 n' g4 d
! r9 d- c8 X6 M! T' K' ~- else if (typeof document.documentElement != 'undefined'8 H2 C6 Y! d y+ A& y
- && typeof document.documentElement.clientWidth !=' H2 G. k0 }$ n/ A; l/ _, I) |
- 'undefined' && document.documentElement.clientWidth != 0)
5 @+ c1 `0 V( @# l+ e - {- o5 }+ J U. v
- viewportwidth = document.documentElement.clientWidth,6 U4 c) |; l! F( C9 a
- viewportheight = document.documentElement.clientHeight9 P, o- I9 K, A" q. k' g2 Y
- }
) ^9 e6 o$ z% ^2 F -
4 P9 s+ Z& p# S% S: } d - // older versions of IE, M/ n' m3 z( s9 r
-
1 l: ?8 [# d* @( H: |$ T- T8 M1 O - else
8 c8 l/ H1 | L1 S/ e - {
) S. d0 r* A z$ ^ b( y. U1 f" X8 B - viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
, B( [& e3 O! e( g( e - viewportheight = document.getElementsByTagName('body')[0].clientHeight, |1 @: k" I1 m) E% C
- }
/ V g) |6 f2 x; W - document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
; P; Z6 n q4 _2 U% p# r; F - //-->
% h) g( G0 O7 H/ n& ^ - </script>
複製代碼 結果: 在google chrome 顯示結果
1 B6 c+ f8 [$ s/ q; o4 R
3 D- N( ?# x8 ?
6 E% m3 Q* J4 Z# ~( K
來源: Get viewport size (width and height) with javascript# V, k3 e. D8 |; n
; E, R4 ?( t& J0 o" T& p6 }8 K
+ }4 g" |0 [' f% V |