Program,Life,Society.....

  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::


      在网页的底部总是保留着公司的版本信息,如何是这部分信息来实现呢?下面的一段javascript演示了如何让footer总是停留在页面的底部。这段代码我在实际使用的时候不是特别的完美,在包含有其他javascript控制的页面和控件的时候会出现重叠的现象,这是因为没有对页面的Body进行onresize和onload操作,希望大家看后有解决的方法)

<HTML>
    
<HEAD>
        
<title>让footer总是停留在页面的底部</title>

        
<script language="javascript">
<!--
function moveFooter() {
    
var iBottom = 0;
    
    
if (document.all) {
        
if (parseInt(document.body.scrollHeight) > parseInt(document.body.clientHeight)) {
            iBottom 
= parseInt(document.body.scrollHeight);
        }    
        
else iBottom = parseInt(document.body.clientHeight);
        document.all[
"lyfooter"].style.pixelTop = iBottom - parseInt(document.all["lyfooter"].style.height);
        document.all[
"lyfooter"].style.visibility = "visible";
    }
    
else if (document.layers)    {
        
if (document.height > self.innerHeight) {
            iBottom 
= document.height;
        }    
        
else iBottom = self.innerHeight;                
        document.layers[
"lyfooter"].top = parseInt(iBottom - document.layers["lyfooter"].document.height);
        document.layers[
"lyfooter"].visibility = "visible";                
    }
    
else if (document.getElementById) { //NS6
        if (document.height > self.innerHeight) {
            iBottom 
= document.height;
        }    
        
else iBottom = self.innerHeight;                    
        document.getElementById(
"lyfooter").style.top = (parseInt(iBottom - parseInt(document.getElementById("lyfooter").style.height))) + "px";        
        document.getElementById(
"lyfooter").style.visibility = "visible";        
        
    }
    
}
//-->
        </script>
    
</HEAD>
    
    
<body MS_POSITIONING="GridLayout" onresize="moveFooter()" onload="moveFooter()">
        
<form id="Form1" method="post">
    
<!----bottom part--------->
<div id="lyfooter" style="position:absolute;left:0px;top:100px;height:19px;z-index:2;visibility:hidden;">
    
<table border="0" width="100%" cellspacing="0" cellpadding="3">
      
<tr>
        
<td width="100%" bgColor="#319a63" class="footnote"><font color="#ffffff" size="2px" face="Verdana, Arial, Helvetica, sans-serif">&copy; 
                                    2005 ABCDE, Inc.
</font></td>
      
</tr>
    
</table>
</div>
<!----/bottom part--------->
        
</form>
    
</body>
</HTML>
posted on 2005-11-24 16:53  vuejs3  阅读(1748)  评论(1编辑  收藏  举报