52AV手機A片王|52AV.ONE
標題:
取得目前可見視窗內容的尺寸--Javascript
[打印本頁]
作者:
media
時間:
2014-12-10 17:42
標題:
取得目前可見視窗內容的尺寸--Javascript
本帖最後由 media 於 2014-12-10 19:08 編輯
5 V, B" V b( \+ Q2 R
' y- h, \. ^1 c$ K+ D, V& @
最近用javascript取視窗的大小時,遇到不同瀏覽器無法偵測或不同的寬高的問題。後來找到下段這段程式碼,當用於點圖放大並顯示於前景中央位置時非常有用。
: x5 @ g# N( D8 G. ^
<script type="text/javascript">
) Z; W' w+ z# @1 B U7 v5 D
<!--
! p& c/ y# M+ f* D/ y
, @. V( q; Y( o! f( X8 N) O% E& y
var viewportwidth;
# |' n7 @6 C, h6 [/ B- F! M
var viewportheight;
7 b4 d, i2 |0 C9 j2 O
/ B2 c! X$ ?5 v9 U7 ?$ S
// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
- {6 C* d& C0 S. t) u, G
: e% u9 j& f& N2 n% V+ Y( Q5 o
if (typeof window.innerWidth != 'undefined')
8 ]5 _1 y& ~; k/ l- [
{
- @( u ^+ @8 T8 U
viewportwidth = window.innerWidth,
$ D0 }$ ?2 G. f& V9 w3 ?2 O' v0 ~; q
viewportheight = window.innerHeight
. {) y8 O b* A3 _9 J7 a1 R, o
}
1 `- i: ]* B* A. [/ _5 {
2 R- E+ E- ~9 h5 t1 ]. A" A9 g- [
// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
+ b& \4 w) B" W# d" D, h
1 l+ Z" [1 O' C, g% P
else if (typeof document.documentElement != 'undefined'
+ q6 x3 _. y# {9 u9 g
&& typeof document.documentElement.clientWidth !=
6 q# L q0 P$ |7 `, F5 j
'undefined' && document.documentElement.clientWidth != 0)
/ _ Z( F% l) @: q# z
{
4 J, c1 b0 b/ W5 S
viewportwidth = document.documentElement.clientWidth,
; U! i1 P: m3 t* b% {- f
viewportheight = document.documentElement.clientHeight
V% b' Z9 B; R X
}
. l, ]8 Y; w( O/ m/ ~9 N7 Y7 g
) r8 |$ d$ [( \ F* n4 k9 u1 H
// older versions of IE
3 |) D6 ^3 H# {9 Z. A
1 t. {1 _1 S3 Z3 D& \; X+ `
else
5 U8 G: E; a8 D, \: Y
{
' v3 g% e" H5 e, {8 F' w: R. o
viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
/ O7 Q: V( S% A, p
viewportheight = document.getElementsByTagName('body')[0].clientHeight
! r9 R) u! \* t3 N" Z
}
" c9 C* n( e9 J5 ~6 |9 d/ r$ _* ~
document.write('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
1 `6 K( X; T' ^- S1 k) O7 y* B! w
//-->
4 U. Y, g# E7 J
</script>
複製代碼
結果: 在google chrome 顯示結果
* e, J5 z; D9 L0 r$ r1 ^
1.png
(81.75 KB, 下載次數: 321)
下載附件
保存到相冊
2014-12-10 19:08 上傳
8 I6 J% o7 D0 B8 F6 F( ~
; k" q+ {1 L9 h8 Q0 a* g; f7 ?
來源:
Get viewport size (width and height) with javascript
7 |: u6 B8 @3 N, y3 h) f, H$ H
, k! K3 N6 e+ x
, |( c/ k* t: L' Q; L5 T
歡迎光臨 52AV手機A片王|52AV.ONE (https://www.52av.one/)
Powered by Discuz! X3.2