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

標題: 取得目前可見視窗內容的尺寸--Javascript [打印本頁]

作者: media    時間: 2014-12-10 17:42
標題: 取得目前可見視窗內容的尺寸--Javascript
本帖最後由 media 於 2014-12-10 19:08 編輯
1 C" r  N0 k' N5 K2 p5 Q6 y4 x$ `% }! ]$ ?+ n
最近用javascript取視窗的大小時,遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼,當用於點圖放大並顯示於前景中央位置時非常有用。& q. o! w' d5 s% d6 l4 Y& @
  1. <script type="text/javascript">  @9 B9 N* F6 m  t' A4 @6 L
  2. <!--
    9 h; }  ?' G! Z2 N& y( W3 r2 P

  3. $ N- v3 v" g) J8 r. N# w1 ~3 t  R
  4. var viewportwidth;
    : ]5 D. `8 D4 O, U# z; ^
  5. var viewportheight;
    0 l5 W0 d6 j) P8 I8 ]  J/ V, I

  6.   `% m1 o/ r1 A
  7. // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight/ P8 o. [5 j! |$ f1 m
  8. 4 R7 W2 n( e1 W9 k7 H4 \
  9. if (typeof window.innerWidth != 'undefined'); e8 C  h- r6 }2 R- |& C
  10. {5 m2 d, C2 b  W* V9 m6 U
  11.       viewportwidth = window.innerWidth,  o+ A8 J& r# V1 G6 t$ K1 j: e7 P# o
  12.       viewportheight = window.innerHeight' w  Q* j& c. ~3 G( v9 ]& B
  13. }& _4 o7 r+ X7 p9 M& j5 H
  14. / R  G/ B3 ~/ N  x* P. G# {
  15. // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)  E% @% p4 G; F2 [3 g, ^

  16.   }4 W3 l$ h% }/ G. D4 c+ ]& Q
  17. else if (typeof document.documentElement != 'undefined'" P; ^+ y9 A+ Z: V0 F) C
  18.      && typeof document.documentElement.clientWidth !=
    3 V- u" c/ {  w8 j5 b7 q
  19.      'undefined' && document.documentElement.clientWidth != 0)# s6 J6 C; b9 A( K- O8 ]6 B
  20. {; ~. z1 P2 d2 n9 N
  21.        viewportwidth = document.documentElement.clientWidth,2 L, Y; u. h" r
  22.        viewportheight = document.documentElement.clientHeight
    : f. h% P0 C2 L( n7 e. T  o
  23. }
    4 o# S% {& R9 H! T$ L& f! Y

  24. 9 a1 t1 R2 f& W* R# j
  25. // older versions of IE' B" L* A- O- Y* w

  26. ( F- M; T* d$ t; e) F* n5 `& D/ m
  27. else, ?* `  [; n8 ?6 F1 v
  28. {
    5 b/ v4 w& r! W4 a$ `2 `) Z. {
  29.        viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
    1 m* ~, c2 ~1 x( A4 N
  30.        viewportheight = document.getElementsByTagName('body')[0].clientHeight% F8 d& `! Q5 O* H, }' I* [
  31. }
      o. F' d& Q/ W! \3 N- w
  32. document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
    3 D( t! x" Y' K+ L& ^
  33. //-->5 A/ p+ E8 o2 h" m
  34. </script>
複製代碼
結果: 在google chrome 顯示結果" ?/ h: h$ m" f$ Z9 A! g

# n/ O  v; a9 Y8 b8 t' `
2 m1 A4 g9 H; _0 W1 z1 J0 d$ X# A
來源:
Get viewport size (width and height) with javascript

, P! e* A5 J; Q
, x! n# Q1 [, ~1 P

' ^; V* Q2 y5 ]8 g# A% g




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