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 p
5 Q6 y4 x$ `% }! ]$ ?+ n
最近用javascript取視窗的大小時,遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼,當用於點圖放大並顯示於前景中央位置時非常有用。
& q. o! w' d5 s% d6 l4 Y& @
<script type="text/javascript">
@9 B9 N* F6 m t' A4 @6 L
<!--
9 h; } ?' G! Z2 N& y( W3 r2 P
$ N- v3 v" g) J8 r. N# w1 ~3 t R
var viewportwidth;
: ]5 D. `8 D4 O, U# z; ^
var viewportheight;
0 l5 W0 d6 j) P8 I8 ] J/ V, I
`% m1 o/ r1 A
// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
/ P8 o. [5 j! |$ f1 m
4 R7 W2 n( e1 W9 k7 H4 \
if (typeof window.innerWidth != 'undefined')
; e8 C h- r6 }2 R- |& C
{
5 m2 d, C2 b W* V9 m6 U
viewportwidth = window.innerWidth,
o+ A8 J& r# V1 G6 t$ K1 j: e7 P# o
viewportheight = window.innerHeight
' w Q* j& c. ~3 G( v9 ]& B
}
& _4 o7 r+ X7 p9 M& j5 H
/ R G/ B3 ~/ N x* P. G# {
// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
E% @% p4 G; F2 [3 g, ^
}4 W3 l$ h% }/ G. D4 c+ ]& Q
else if (typeof document.documentElement != 'undefined'
" P; ^+ y9 A+ Z: V0 F) C
&& typeof document.documentElement.clientWidth !=
3 V- u" c/ { w8 j5 b7 q
'undefined' && document.documentElement.clientWidth != 0)
# s6 J6 C; b9 A( K- O8 ]6 B
{
; ~. z1 P2 d2 n9 N
viewportwidth = document.documentElement.clientWidth,
2 L, Y; u. h" r
viewportheight = document.documentElement.clientHeight
: f. h% P0 C2 L( n7 e. T o
}
4 o# S% {& R9 H! T$ L& f! Y
9 a1 t1 R2 f& W* R# j
// older versions of IE
' B" L* A- O- Y* w
( F- M; T* d$ t; e) F* n5 `& D/ m
else
, ?* ` [; n8 ?6 F1 v
{
5 b/ v4 w& r! W4 a$ `2 `) Z. {
viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
1 m* ~, c2 ~1 x( A4 N
viewportheight = document.getElementsByTagName('body')[0].clientHeight
% F8 d& `! Q5 O* H, }' I* [
}
o. F' d& Q/ W! \3 N- w
document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
3 D( t! x" Y' K+ L& ^
//-->
5 A/ p+ E8 o2 h" m
</script>
複製代碼
結果: 在google chrome 顯示結果
" ?/ h: h$ m" f$ Z9 A! g
1.png
(81.75 KB, 下載次數: 365)
下載附件
保存到相冊
2014-12-10 19:08 上傳
# 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