52AV手機A片王|52AV.ONE
標題:
取得目前可見視窗內容的尺寸--Javascript
[打印本頁]
作者:
media
時間:
2014-12-10 17:42
標題:
取得目前可見視窗內容的尺寸--Javascript
本帖最後由 media 於 2014-12-10 19:08 編輯
/ x/ `* R0 H& i
! X! M/ W7 ?6 e
最近用javascript取視窗的大小時,遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼,當用於點圖放大並顯示於前景中央位置時非常有用。
9 y6 K8 O9 I% ?" c8 G, z# S; T
<script type="text/javascript">
2 D) m% d* V" L" R1 Q
<!--
& |( _! |4 ^* A
# @# `) X4 _$ H4 @- e
var viewportwidth;
# G) }& U" @1 f! V
var viewportheight;
/ L3 @+ T/ T% f, B* t
( \. {8 j& u- R( \
// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
' I& m% W9 z5 X2 M
& [* R0 f; Q& ]. I+ L8 I) B) N
if (typeof window.innerWidth != 'undefined')
4 h- M) x1 y+ {
{
7 J' C8 w" r- u. o G2 _
viewportwidth = window.innerWidth,
* A7 h+ `7 f$ c
viewportheight = window.innerHeight
0 ?5 I2 R5 S' c6 Y
}
. M8 r9 _- j# ] P
, y) f* j2 I& ~9 E; a0 ^
// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
, S- I* ^ e2 v- n$ q A
$ K4 f% K1 i4 O4 B3 W
else if (typeof document.documentElement != 'undefined'
' |% F' Y5 @3 S, n
&& typeof document.documentElement.clientWidth !=
1 ^3 N( H1 h. [, l# V, g' Z
'undefined' && document.documentElement.clientWidth != 0)
; |7 d- L0 @# x6 {8 }4 P0 n
{
$ Z; x, K0 r, M2 x/ A& \4 e5 s
viewportwidth = document.documentElement.clientWidth,
6 U' b; W7 J, m. v! ^+ M
viewportheight = document.documentElement.clientHeight
0 c' ]% @" h' g- A
}
8 h: r' v7 R+ x7 f5 x5 @
# i+ B* e9 A; _/ t* s6 S8 [
// older versions of IE
+ @; f5 J5 H2 w0 y9 p. L, h, J
6 M6 i" n0 z8 _' S; K% b7 o' U
else
: X5 o& x- O8 X' q% M7 u" V
{
& O% w; r7 a/ `# m7 L
viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
$ k) t; a0 C3 F% j2 g; y) S8 }
viewportheight = document.getElementsByTagName('body')[0].clientHeight
* }. [1 ?" D9 H% v; |
}
3 L% ], r. D. ^9 O3 r, `
document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
3 ^8 i0 f% k" V9 l) b% _9 D
//-->
2 Y" t5 z* N! x9 {
</script>
複製代碼
結果: 在google chrome 顯示結果
. X7 Y( J! A4 O% V. W# b2 q0 n% J
1.png
(81.75 KB, 下載次數: 384)
下載附件
保存到相冊
2014-12-10 19:08 上傳
: Z1 T2 i) E3 K" f9 F& ^- G
3 J7 T0 t0 V9 h# w, U0 Q
來源:
Get viewport size (width and height) with javascript
4 k1 _( \9 ?/ q" W3 @
# e I& S& {& b, z
, r' p% X7 _+ A w9 e5 y
歡迎光臨 52AV手機A片王|52AV.ONE (https://www.itech.casa/)
Powered by Discuz! X3.2