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

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

作者: media    時間: 2014-12-10 17:42
標題: 取得目前可見視窗內容的尺寸--Javascript
本帖最後由 media 於 2014-12-10 19:08 編輯 3 y+ U$ b% Y% K5 W' H. F
* T/ @; x# J- y! f. s
最近用javascript取視窗的大小時,遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼,當用於點圖放大並顯示於前景中央位置時非常有用。) m$ W4 u: t, v# u
  1. <script type="text/javascript">
    - A7 k. T- N% e$ ~2 K. {6 H7 J
  2. <!--+ M$ g3 ^7 ?) }* i4 v  K+ F

  3. - g$ |8 N; p. ^' r) `' W) C
  4. var viewportwidth;
    2 Z; A" F0 P6 H2 {* h
  5. var viewportheight;/ W( C) r) N" W  H: a. _

  6. " V$ O& |5 w: k! f+ D- H
  7. // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
    ) y) e' c& p" h/ e1 U+ m+ i

  8. " O8 u) w5 t* \. U! |
  9. if (typeof window.innerWidth != 'undefined')
    # Y+ m4 V! `3 k; U+ e, ^
  10. {
    # a, B. P' p' [$ o
  11.       viewportwidth = window.innerWidth,8 O) _' ]; q2 ?. Q# l/ f: K4 ^
  12.       viewportheight = window.innerHeight
    3 U9 R) I: t+ c6 ?2 m
  13. }
    1 `, Y6 H( t- ~; o3 u7 r3 c

  14. + `7 S  E$ c+ E7 M9 `- {
  15. // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)# u9 |% F- H* j/ Q% S

  16. 1 [/ w3 W7 G+ s) Q& C! v2 |7 \
  17. else if (typeof document.documentElement != 'undefined'
    0 }/ Z8 m# r; }7 C2 M7 d. i% F
  18.      && typeof document.documentElement.clientWidth !=
    ' N9 L4 ~! K9 w+ [6 q0 m+ E
  19.      'undefined' && document.documentElement.clientWidth != 0)2 h7 R5 {/ _# K& ~8 u
  20. {
    # L/ X9 E* x; c, e: E$ _4 N
  21.        viewportwidth = document.documentElement.clientWidth,
    , b1 G& ?5 ~7 g7 N
  22.        viewportheight = document.documentElement.clientHeight6 K5 N1 Y6 d. T3 o. t1 b$ d
  23. }
    " i3 Q/ Y7 ~& v

  24. ! {& W# X+ ~$ Q, q9 b8 F
  25. // older versions of IE1 f% f$ ~* {# r6 m

  26. 5 `; @2 \3 B0 L$ ]2 ~1 }
  27. else
    % v' g7 [5 E2 {8 {( }1 a
  28. {/ \" E5 [9 F( i6 d" c
  29.        viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
    . v2 C% L6 D# R0 X
  30.        viewportheight = document.getElementsByTagName('body')[0].clientHeight
    8 w, ?. R+ \+ X8 N/ j, t
  31. }" v$ B/ V) r3 f
  32. document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');2 E. X; c! {/ m( Y  ]1 j
  33. //-->
    / m$ C+ R5 u% W1 ]4 m" U
  34. </script>
複製代碼
結果: 在google chrome 顯示結果
+ G0 T) G5 m2 a* w: [+ H) ?! S' L/ k( X( p
8 \/ D8 A9 K; m- N0 ?" D

4 k: J/ L7 r- Y6 G5 w8 ]. @來源:
Get viewport size (width and height) with javascript

& \; d% j( A0 s0 w' a2 x9 \  Z3 ?5 V( q4 |  z

/ C, w8 }. |; e" K; d$ B




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