当前位置：Gxlcms > JavaScript > js让一行页脚保持在底部

js让一行页脚保持在底部

时间：2021-07-01 10:21:17 帮助过：4人阅读

测了一下，还可以，在IE6、IE7、FIREOFX等都没有问题！窗口缩小时也没有问题！

代码如下:
<script language="JavaScript" type="text/javascript">
function test(){
var infoHeight = document.getElementById("info").scrollHeight;
var bottomHeight = document.getElementById("bottom").scrollHeight;
var allHeight = document.documentElement.clientHeight;

var bottom = document.getElementById("bottom");
if((infoHeight + bottomHeight) < allHeight){
  bottom.style.position = "absolute";
  bottom.style.bottom = "0";
}else{
  bottom.style.position = "";
  bottom.style.bottom = "";
}

setTimeout(function(){test();},10);
}
test();
</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>www.gxlcms.com 脚本之家</title> 
<style> 
*{ margin:0; padding:0} 
#info{background:#33CCFF} 
#bottom{background:#FFCC00;width:100%;} 
</style> 
</head> 
<body>

2
2
2

2
2
2
2
2
2
2
2

2
2
2
2
2

2
20000 
bottom

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

js让一行页脚保持在底部

人气教程排行