如何使层固定在网页底部?
所属分类:Javascript, 网站建设 2010-3-8,08:52 487 views
如何使层固定在网页底部? 如果抛开IE6的话,只需要CSS就可以了,所以兼容IE6还需要一段JS。
第一部分:CSS
<STYLE>#fdc{ background:#f4f4f4 ; width:100%; position:fixed; height:35px; left:0; bottom:0; overflow:hidden;}
.fdcnr{width:1000px; margin:0 auto; position:relative; height:35px; padding:3px 0 2px 0;}
.fdcleft{float:left;}
.fdcleft1{ float:left;}
</STYLE>
第二部分:兼容Ie6的js
<!–[if lte IE 6]>
<script type=”text/javascript”>
if(typeof document.compatMode!=’undefined’&&document.compatMode!=’BackCompat’){
cot_t1_DOCtp=”_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth – offsetWidth);}”;
}else{
cot_t1_DOCtp=”_top:expression(document.body.scrollTop+document.body.clientHeight-this.clientHeight);_left:expression(document.body.scrollLeft + document.body.clientWidth – offsetWidth);}”;
}
var fdc_bodyCSS=’* html {background:url(/images/common/blank.gif) fixed;background-repeat: repeat;background-position: right bottom;}’;
var fdcCSS=’#fdc {position:fixed;’;
var fdcCSS=fdcCSS+’_position:absolute;’;
var fdcCSS=fdcCSS+’z-index:1;’;
var fdcCSS=fdcCSS+’width:100%;’;
var fdcCSS=fdcCSS+’text-align:center;’;
var fdcCSS=fdcCSS+’bottom:0px;’;
var fdcCSS=fdcCSS+’right:0px;’;
var fdcCSS=fdcCSS+’clip:rect(0 100% 100% 0);’;
var fdcCSS=fdcCSS+cot_t1_DOCtp;
document.write(’<style type=”text/css”>’+fdc_bodyCSS+fdcCSS+’</style>’);
</script>
<![endif]–>
第三:html部分
<DIV id=”fdc”>
<DIV align=”center” style=”margin:0 auto”>
<TABLE width=”998″ border=”0″ align=”center” style=”margin:0 auto”>
<TBODY><TR>
<TD><DIV class=”fdcnr”><DIV class=”fdcleft”><A href=”http://kft.zoosnet.net/LR/Chatpre.aspx?id=KFT77879183″ target=”_blank”><IMG src=”/skin/images/fuzhou-01.gif”></A></DIV>
<DIV class=”fdcleft”>
<A href=”http://kft.zoosnet.net/LR/Chatpre.aspx?id=KFT77879183″ target=”_blank”><IMG src=”/skin/images/fuzhou-02.gif”></A>
</DIV>
<DIV class=”fdcleft”><A href=”http://kft.zoosnet.net/LR/Chatpre.aspx?id=KFT77879183″ target=”_blank”><IMG src=”/skin/images/fuzhou-03.gif”></A></DIV></DIV> </TD>
</TR>
</TBODY></TABLE>
</DIV>
</DIV>
实例参考:裕湘医院,猛击进入
上一篇: 网站推广的108种方式 下一篇: 谷歌退出中国,网站流量不降反升