fixed真的是一个非常好的属性。
特别是做弹层的时候。可惜的是“国内主流浏览器”IE6大大不支持。
一般的我们都会通过CSS中的表达式来解决问题。
.fixed { position:absolute; left:expression(eval(document.documentElement.scrollLeft)); top:expression(eval(document.documentElement.scrollTop)) }
好吧,希望施主的钛合金眼还好。一闪一闪亮晶晶~~~
html,html body { background-image:url(about:blank); background-attachment:fixed }
这个已经是IE非常出名的“BUG” 了。当滚动或调整浏览器大小时,它将重置全部内容并重画页面,会又一次处理CSS表达式。终于就闪坏了施主的钛合金眼。
上面的代码能够让浏览器在重画之前首先处理CSS表达式,这样就让你实现完美的fixed了。
事实上还有个问题了……,做弹层的时候居中的问题。
非IE6的时候
.float { left:50%; top:50%; margin-left:-262px; margin-top:-180px; width:525px; height:360px; }
left和top的属性已经被表达式占用了。
这个也非常easy的,获取页面的宽度和高度,计算出直接的margin值就好了。
注意高度应该用document.documentElement.clientHeight,这种话就是可视区域的高度。
特别是用遮罩层的时候,否则会出现,页面能够无限下拉的情况。