52AV手機A片王|52AV.ONE

標題: 取得目前可見視窗內容的尺寸--Javascript [打印本頁]
作者: media    時間: 2014-12-10 17:42
標題: 取得目前可見視窗內容的尺寸--Javascript
本帖最後由 media 於 2014-12-10 19:08 編輯 % A6 M/ B5 y0 Q
( z' ~3 z" \2 L7 `
最近用javascript取視窗的大小時，遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼，當用於點圖放大並顯示於前景中央位置時非常有用。
. a* ^$ ^) ]' i: v& J" r1 V
  1. <script type="text/javascript">8 [* [" L, F1 h: G( I6 ]4 A$ a7 f
  2. <!--, E; M/ _" |% D, z
  3. ! I$ F! I3 ^; m
  4. var viewportwidth;( D3 ~- c+ j& g9 B
  5. var viewportheight;- W% c$ R1 I. c
  6. 4 P" r( S( J/ m( R
  7. // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
    . M0 ]. \! b% J  ]

  8. 8 [. X- L0 x2 G& q; i1 `! f
  9. if (typeof window.innerWidth != 'undefined')6 _/ Z5 W8 S# q
  10. {6 `  v& W# v" S- _2 X0 l
  11.       viewportwidth = window.innerWidth,0 C% m6 y4 Y7 R6 q
  12.       viewportheight = window.innerHeight
    5 x& e, o9 r0 W  W7 P
  13. }
    ( H' `) L$ p; U2 D
  14. " s9 G/ g" w% `4 O6 w2 T( L
  15. // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)2 V4 g. J0 Z- ~! i7 C
  16. ) Q2 f  k1 D/ [8 y
  17. else if (typeof document.documentElement != 'undefined'
    & m+ P7 H( d5 c0 b4 \4 ^& Z: j
  18.      && typeof document.documentElement.clientWidth !=
    + ?+ m5 U" {$ i7 L  `2 m
  19.      'undefined' && document.documentElement.clientWidth != 0)" C' K' L! y! L- Q
  20. {+ O7 `1 P  s. u* m
  21.        viewportwidth = document.documentElement.clientWidth,
    4 b) `) N" ], B8 k. L
  22.        viewportheight = document.documentElement.clientHeight
      b* J& X0 s) [2 ~
  23. }" i: J( m& P0 t# S9 K3 w+ g

  24. # b: i% |2 V- Y& d
  25. // older versions of IE
    * a  q0 p7 \1 ?0 x2 a2 s1 z
  26. 8 I: J  |4 k% q' ?- p% V
  27. else- {/ A. R& J) I) y$ I' D
  28. {1 n9 J2 s) v5 G3 S7 B2 i
  29.        viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
    / U& Y  u; ?. G" v
  30.        viewportheight = document.getElementsByTagName('body')[0].clientHeight
    + O' c: m- K/ h+ c, Y  d
  31. }8 [! b% Y$ G) p! H$ B: D% B
  32. document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');' U9 w# O! z* I1 T# j. W/ b% m
  33. //-->
      Q! s4 j5 z2 R
  34. </script>
複製代碼
結果: 在google chrome 顯示結果
- u4 L* m& u% J  _) p
- `) ]9 ?" b* x% H' j! o" q% E( ~+ P. f4 F$ \  h
來源: Get viewport size (width and height) with javascript
) d$ K. ]; l& _, G" B: c6 z1 Z+ G- b+ M1 T1 \

( _0 F+ _: \8 p# e0 p( a& |



歡迎光臨 52AV手機A片王|52AV.ONE (https://www.52av.one/) Powered by Discuz! X3.2