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

標題: 取得目前可見視窗內容的尺寸--Javascript [打印本頁]
作者: media    時間: 2014-12-10 17:42
標題: 取得目前可見視窗內容的尺寸--Javascript
本帖最後由 media 於 2014-12-10 19:08 編輯
5 f* W; E' a, |) E" N3 r8 c' A$ \) J1 V5 S# e' y
最近用javascript取視窗的大小時，遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼，當用於點圖放大並顯示於前景中央位置時非常有用。
8 G: k: \; u' M: r& U( U5 E
  1. <script type="text/javascript">
    7 e6 ^' n1 t: e
  2. <!--6 [: I3 p$ @0 }/ J* i8 h, J6 g: x& |

  3. 1 e. q5 Y( M. o* V% K
  4. var viewportwidth;
    0 ~/ G, T* v& _' d& w
  5. var viewportheight;: m1 \  T: u. U  V5 n
  6. ! U, W8 j5 A) \$ m: V
  7. // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight) t8 d# P( V4 h& ^9 V2 l
  8.   |3 |/ a/ R& M' ^- v5 @3 i
  9. if (typeof window.innerWidth != 'undefined')- s& i: X1 k7 m9 a% I: m8 B
  10. {
    $ m' ?# Z* X$ z6 f* M
  11.       viewportwidth = window.innerWidth,  s6 c1 O+ T: e( e# m8 P
  12.       viewportheight = window.innerHeight
    ; d. w3 v' q. a8 l1 s
  13. }3 H( i( M" c0 U
  14. ( f: d6 C7 C# Q
  15. // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
    - K: |: g& F) v4 q, q0 m

  16. " q+ ^+ C  R6 W5 H) _# k+ u
  17. else if (typeof document.documentElement != 'undefined', b9 u9 M7 k2 f, N4 e3 n
  18.      && typeof document.documentElement.clientWidth !=6 k4 @% A: {, w3 `6 H+ Y
  19.      'undefined' && document.documentElement.clientWidth != 0)- t5 Q# @' W: H3 x2 F
  20. {
    * C: _; s! X  @3 A* h0 z4 a$ d
  21.        viewportwidth = document.documentElement.clientWidth,: B6 A3 e4 ~6 M. [2 G! M
  22.        viewportheight = document.documentElement.clientHeight3 J5 w7 J* i( J% \6 Z! q5 t
  23. }8 K; }0 }$ m* I3 O( O
  24. 0 d6 Z' o% P+ U# y% W/ U
  25. // older versions of IE. r( p  o  {! M+ }5 F

  26. ' C' s/ W1 F9 T7 f: f2 i
  27. else" n' t+ a3 V- [) ^3 S8 \3 R: v
  28. {
    2 a+ O" `! R# b
  29.        viewportwidth = document.getElementsByTagName('body')[0].clientWidth,2 N% K8 G* q# ~' j# \& a2 E2 `. X
  30.        viewportheight = document.getElementsByTagName('body')[0].clientHeight) z6 I, T, {6 I: B6 v6 W
  31. }/ ?. F" S' W4 X% z6 S# O
  32. document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');4 f7 T2 C1 w7 Y! M2 ?
  33. //-->
      k$ w8 ^8 i" }' o  q8 R! v- Q( e
  34. </script>
複製代碼
結果: 在google chrome 顯示結果
4 q- a7 |3 ]2 h, r. c. x* M
, p9 ~* x2 j5 ]
( l7 T+ X9 k7 n) _# P來源: Get viewport size (width and height) with javascript/ Z" f2 [8 l$ q' f5 U& d- g7 X

2 v$ C0 E8 o5 i7 Q6 }5 k% |* e+ d: P' Y  X' @+ \# ^




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