取得目前可見視窗內容的尺寸--Javascript[含1張圖]

media

6 I6 V/ Z, F  A6 f& J
最近用javascript取視窗的大小時，遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼，當用於點圖放大並顯示於前景中央位置時非常有用。

1. <script type="text/javascript">
   
2. <!--
   
3. 
   ! d8 a( a7 h- H+ u; r/ ?. k
4. var viewportwidth;
   
5. var viewportheight;
   4 E2 [2 d  B: c+ w- p
6. 
   
7. // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
   
8. 
   ; `7 c% H3 q, r
9. if (typeof window.innerWidth != 'undefined')
   
10. {
    
11.       viewportwidth = window.innerWidth,
    - M; t4 P" E1 _* u6 L4 u
12.       viewportheight = window.innerHeight
    - O/ c% z) w0 u" N0 g4 @5 `  |* r
13. }
    ( n  v* H  d. p5 ^! l# W  M
14. 
    ' g/ o) R; p0 E, c. T' t
15. // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
    
16. 
    
17. else if (typeof document.documentElement != 'undefined'
    
18.      && typeof document.documentElement.clientWidth !=
    
19.      'undefined' && document.documentElement.clientWidth != 0)
    5 \1 k  T/ w4 R2 p& n) F% p
20. {
    + k& B, R+ v7 C9 x) e
21.        viewportwidth = document.documentElement.clientWidth,
    
22.        viewportheight = document.documentElement.clientHeight
    9 G- M5 t. s7 H; O6 ]5 u
23. }
    ; C( [. i, G$ T  d) f
24. 
    
25. // older versions of IE
    ! [: r5 c/ S7 j, P6 y8 F0 Y7 i
26. 
    
27. else
    
28. {
    
29.        viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
    6 s  M0 ]$ P! l* x* K  r
30.        viewportheight = document.getElementsByTagName('body')[0].clientHeight
    
31. }
    
32. document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
    - t$ A4 y" i3 O0 C, [
33. //-->
    
34. </script>

複製代碼

結果: 在google chrome 顯示結果
. _' x+ b9 E5 ]/ s  {

7 f' I9 h; N6 O4 _* ~& t3 J來源: Get viewport size (width and height) with javascript