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
<script type="text/javascript">
- A7 k. T- N% e$ ~2 K. {6 H7 J
<!--
+ M$ g3 ^7 ?) }* i4 v K+ F
- g$ |8 N; p. ^' r) `' W) C
var viewportwidth;
2 Z; A" F0 P6 H2 {* h
var viewportheight;
/ W( C) r) N" W H: a. _
" V$ O& |5 w: k! f+ D- H
// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
) y) e' c& p" h/ e1 U+ m+ i
" O8 u) w5 t* \. U! |
if (typeof window.innerWidth != 'undefined')
# Y+ m4 V! `3 k; U+ e, ^
{
# a, B. P' p' [$ o
viewportwidth = window.innerWidth,
8 O) _' ]; q2 ?. Q# l/ f: K4 ^
viewportheight = window.innerHeight
3 U9 R) I: t+ c6 ?2 m
}
1 `, Y6 H( t- ~; o3 u7 r3 c
+ `7 S E$ c+ E7 M9 `- {
// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
# u9 |% F- H* j/ Q% S
1 [/ w3 W7 G+ s) Q& C! v2 |7 \
else if (typeof document.documentElement != 'undefined'
0 }/ Z8 m# r; }7 C2 M7 d. i% F
&& typeof document.documentElement.clientWidth !=
' N9 L4 ~! K9 w+ [6 q0 m+ E
'undefined' && document.documentElement.clientWidth != 0)
2 h7 R5 {/ _# K& ~8 u
{
# L/ X9 E* x; c, e: E$ _4 N
viewportwidth = document.documentElement.clientWidth,
, b1 G& ?5 ~7 g7 N
viewportheight = document.documentElement.clientHeight
6 K5 N1 Y6 d. T3 o. t1 b$ d
}
" i3 Q/ Y7 ~& v
! {& W# X+ ~$ Q, q9 b8 F
// older versions of IE
1 f% f$ ~* {# r6 m
5 `; @2 \3 B0 L$ ]2 ~1 }
else
% v' g7 [5 E2 {8 {( }1 a
{
/ \" E5 [9 F( i6 d" c
viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
. v2 C% L6 D# R0 X
viewportheight = document.getElementsByTagName('body')[0].clientHeight
8 w, ?. R+ \+ X8 N/ j, t
}
" v$ B/ V) r3 f
document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
2 E. X; c! {/ m( Y ]1 j
//-->
/ m$ C+ R5 u% W1 ]4 m" U
</script>
複製代碼
結果: 在google chrome 顯示結果
+ G0 T) G5 m2 a* w: [+ H) ?! S' L/ k( X( p
1.png
(81.75 KB, 下載次數: 133)
下載附件
保存到相冊
2014-12-10 19:08 上傳
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