无休止的运动!

让页脚保持在底部

2008-03-17 17:52:28 / 个人分类:XHTML/CSS

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">有风的日子(x4j],eW[]WK
<html xmlns="http://www.w3.org/1999/xhtml">有风的日子MT'u}N`
<head>有风的日子*X:n~\_
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />有风的日子$k AD o;j.d
<title>http://www.zishu.cn</title>有风的日子4J|nn_t
<style>有风的日子A9c)@8@(Z8H]
*{ margin:0; padding:0}有风的日子5f+td3Y'E0w/H'D0S
#info{background:#33CCFF}
5N&Vy1fUV&Z8K9BLt0#bottom{background:#FFCC00;width:100%;}
L oLr R*t9}"u0</style>有风的日子0lw;Qn E paBa["G
</head>有风的日子,k.vjRqc%l
<body>有风的日子.hB0nDH/G
<div id="info">有风的日子sHiop
<br />2<br />2<br />2<br /><br />2<br />2<br />2<br />2<br />2<br />2<br />2<br />2<br /><br />2<br />2<br />2<br />2<br />2<br /><br />2<br />2<br />2<br />2<br />2<br /><br />2<br />2<br />2<br />2<br />2<br /><br />2<br />20000</div>
(K%^G+{H `z V0<div id="bottom">bottom</div>
)i:Ww.E9c ^KM0有风的日子'eO-p b y
<scrīpt language="Javascrīpt" type="text/javascrīpt">
-D2Y8?~#Dk0function test(){有风的日子1qlwv cd*a)e
 var infoHeight = document.getElementById("info").scrollHeight;
[l#xj;l0 var bottomHeight = document.getElementById("bottom").scrollHeight;
9`8T9}Y1n'j&\0 var allHeight = document.documentElement.clientHeight;有风的日子K+T3p3f qX6A[
 
3T$J%x8Yx0 var bottom = document.getElementById("bottom");有风的日子r X*Zwy
 if((infoHeight + bottomHeight) < allHeight){
]ZC-g*s {4o+w/H P0  bottom.style.position = "absolute";
G^z%g0v0  bottom.style.bottom = "0";有风的日子P2{ H@m,mx
 }else{
5ne+t.I!Z _-l ?jW4Fj0  bottom.style.position = "";
v2w,cS!Q4v0|0  bottom.style.bottom = "";
7G7v:|)^XIL0 }
8{~]l?2ege/`0 有风的日子 c7CN9p3Pq#P/~G
 setTimeout(function(){test();},10);
e,z {t"J$N0}
F5AWjr ZH|4g)O`0test();
_ah&h$y6oa0</scrīpt>有风的日子2|"h V^Q9Z1B5@d
</body>有风的日子U(S?mN D S5oT
</html>
7P Us.P/@&gW\ t0

TAG:

我来说两句

-5 -3 -1 - +1 +3 +5

Open Toolbar