tid=159& 本帖最後由 media 於 2014-12-10 19:08 編輯
/ R! V9 E$ o# N! _6 |) `- q( U* T
最近用javascript取視窗的大小時,遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼,當用於點圖放大並顯示於前景中央位置時非常有用。
; w: u8 A3 [3 \ ~0 n- <script type="text/javascript">
# l3 B! |4 ]+ N+ v4 N( n1 f: q - <!--
# z; e M0 E1 p9 y r
" ?8 f7 s" i" P* K. D- var viewportwidth;4 R9 e/ \& L( ?9 D1 D5 G; J( n+ ?
- var viewportheight;
1 O% {1 V4 H2 s. P: S - % Z, V+ i% c- n
- // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
9 x% E |/ Y, S - 1 c* m0 k$ g& K
- if (typeof window.innerWidth != 'undefined')
. C& Q$ a* ]/ k; c9 L- S; I - {
& S) C: F1 c8 _ - viewportwidth = window.innerWidth,) z3 W0 z/ r: h5 O
- viewportheight = window.innerHeight
/ ?9 n N0 u, u1 v( R8 G" B/ x - }$ p3 F) C) _4 W( |1 p6 p
-
, C- A1 K: R: i7 [: v - // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
7 I/ d' P( b8 f$ S) Q1 S3 A - / F9 ~: L9 [, P& i; p% F- Q3 F
- else if (typeof document.documentElement != 'undefined': [, D! k3 e# W7 _- j; b
- && typeof document.documentElement.clientWidth !=/ s' X/ {; o$ J: x
- 'undefined' && document.documentElement.clientWidth != 0)
, q+ K8 V# F* f' K; i* }" K* t - {
/ w c+ x' g! E: |5 x# h/ p* }4 K - viewportwidth = document.documentElement.clientWidth,/ V& N/ k' Y% V) @$ ]
- viewportheight = document.documentElement.clientHeight
* i- r: H O/ ~- {% C - }
6 Y/ p8 A/ F' u# Q - + C( `* {, F# M9 {
- // older versions of IE
( Q! @ T9 s; e' k: L - 0 T. q& `) k8 H1 J% N
- else& H' P R8 d( I7 N+ ~
- {. V* E# }; U( L
- viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
- X# Q, M. A# s) _1 P/ o - viewportheight = document.getElementsByTagName('body')[0].clientHeight5 Q( m S8 m9 G
- }4 z9 i6 ^4 D' q$ T8 j* K: p/ r& h
- document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');7 c( ^- x' B; `) ?- B
- //-->
& J% u: V6 M( j# j& ~2 P - </script>
複製代碼 結果: 在google chrome 顯示結果
9 }, r9 f( R5 t3 k* T
% r. o. w! O( s* M6 q5 m5 L" T. H$ U: Y3 f2 x P
來源: Get viewport size (width and height) with javascript
& t# g( L: y6 C! d
4 i" F. M' B) h1 I) h) s! C6 J
3 K2 R& ]' Q' ^ |