这是关于实现css固定div层在页面顶部,css固定div层在页面底部的代码,兼容IE6
有时需要把一个元素固定在页面的某个部位,一般的解决方法是:
<div class="box"></div>
.box{position:fixed;bottom:0;right:10px;
}
让元素固定在浏览器的底部和距离右边的10个像素。一般的浏览器都支持这种方法,但是ie6不支持fixed
解决办法:
.box{
osition:fixed;
_position:absolute;
bottom:0;
right:10px;
_bottom:auto;
_top
:expression(eval(document.documentElement.scrollTop
+document.documentElement.clientHeight
-this.offsetHeight-(parseInt(this.currentStyle.marginTop,
10
)||
0
)
-(parseInt(this.currentStyle.marginBottom,
10
)||
0
)))
}
使元素固定在浏览器的顶部:
.box
{
_position:absolute;
_bottom:auto;
_top:expression(eval(document.documentElement.scrollTop));
}
使元素固定在浏览器的底部:
.
box{
_position:absolute;
_bottom:auto;
_top:expression(eval(document.documentElement.scrollTop
+document.documentElement.clientHeight
-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)
-(parseInt(this.currentStyle.marginBottom,10)||0)));
}
这两段代码只能实现在最底部跟最顶部,你可以使用 _margin-top:10px;
或者_margin-bottom:10px;
修改其中的数值控制元素的位置。
在ie中你会发现被固定定位的元素在滚动滚动条的时候会闪动
解决的方法是:
*html{
background-image:url(about:blank); /*使用空背景*/
background-attachment:fixed; /*固定背景*/
}
这样ie6中不支持fixed问题算是解决了。