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

media

- j1 M2 a4 F9 v2 F5 `最近用javascript取視窗的大小時，遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼，當用於點圖放大並顯示於前景中央位置時非常有用。
" H, R  W8 C9 v! f4 N

1. <script type="text/javascript">
   
2. <!--
   / \; T; F# |6 Q' }; L2 _4 k& _
3. 
   
4. var viewportwidth;
   1 [0 j  H2 L+ ?) D! i4 ~% G4 l
5. var viewportheight;
   
6. 
   
7. // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
   # k1 G6 Y/ |; h$ J- R
8. 
   
9. if (typeof window.innerWidth != 'undefined')
   ) c3 U; i/ ]6 i4 u3 w% {
10. {
    
11.       viewportwidth = window.innerWidth,
    
12.       viewportheight = window.innerHeight
    
13. }
    
14. 
    
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'
    9 Y! U# [) A( P" @+ R, u; [% y
18.      && typeof document.documentElement.clientWidth !=
    
19.      'undefined' && document.documentElement.clientWidth != 0)
    
20. {
    * u6 w" F0 T+ E6 I/ H
21.        viewportwidth = document.documentElement.clientWidth,
    
22.        viewportheight = document.documentElement.clientHeight
    
23. }
    
24. 
    
25. // older versions of IE
    / G" X% y5 a' j* `' T' k9 {
26. 
    / y" v( t% [' G4 s- C9 Q5 y
27. else
    
28. {
    & l6 @0 A- G0 o
29.        viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
    9 k5 `  G, m3 q8 U
30.        viewportheight = document.getElementsByTagName('body')[0].clientHeight
    
31. }
    3 T, _$ H) y( Z7 d" V6 V$ F
32. document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
    + m* A! P) H5 l5 ~1 {% d
33. //-->
    4 Z- j0 `  v" D- |4 M6 n* X
34. </script>

複製代碼

結果: 在google chrome 顯示結果
& }+ `0 o& z2 O# \$ ]$ m+ f$ Y+ `

- g; m( Y3 j2 S" x# R來源: Get viewport size (width and height) with javascript

& K, D& `6 \8 _" j- m- |/ v