博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
IE6下position:fixed不支持问题及其解决方式
阅读量:5917 次
发布时间:2019-06-19

本文共 937 字,大约阅读时间需要 3 分钟。

IE6有诸多奇葩。不支持position:fixed就是当中之中的一个。所以在做一些比方固定在顶部或者底部或者固定元素的效果时须要考虑兼容IE6的这个问题。解决方式是用Ie6的hack。

*html {/* 仅仅有IE6支持 */    background-image: url(about:blank);     background-attachment: fixed; /* 固定背景 */}#box {    /* 非IE6浏览器使用固定元素 */    position: fixed;    top: 0;    left: 0;    /* IE6改为绝对定位,并通过css表达式依据滚动位置更改top的值 */    _position: absolute;    _top: expression(eval(document.documentElement.scrollTop));}
这里还须要解决的是“抖动”的问题,由于当你滚动滚动栏的时候expression下的样式一直在又一次计算而且运行css,会产生延迟的抖动。而在使用固定背景之后。在滚动的时候先运行了css,再又一次计算网页,所以不会产生抖动的现象。
以下是固定究竟部的代码,须要细致看一下:

_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
PS:在网上看到expression的诸多弊病。也是雅虎34条里面竭力避免使用css表达式的一个重要原因。摘引一段话:表达式的问题就在于它的计算频率要比我们想象的多。

不不过在页面显示和缩放时,就是在页面滚动、乃至移动鼠标时都会要又一次计算一次。给CSS表达式添加一个计数器能够跟踪表达式的计算频率。在页面中随便移动鼠标都能够轻松达到10000次以上的计算量。

由此可见一斑。

转载地址:http://apfvx.baihongyu.com/

你可能感兴趣的文章
poj 1789 Truck History
查看>>
Python数据分析基础教程
查看>>
FTP上传下载
查看>>
Android中的自定义数据适配器
查看>>
Shell根据年月日创建文件夹
查看>>
SQL Server 2012新特性与应用解决方案
查看>>
hdu6040
查看>>
加密和签名的相关知识
查看>>
2017.10.24 A test error about ATE device
查看>>
CSS绝对定位的应用
查看>>
NX回转实体实例 UF_MODL_create_revolution
查看>>
监听EF执行的sql语句及状态
查看>>
并查集(路径更新) LA 3027 Corporative Network
查看>>
stl(set+stack) LA 3634 The SetStack Computer
查看>>
ACM进阶计划
查看>>
第四章 关于测试的一些思考
查看>>
BZOJ3172:[TJOI2013]单词——题解
查看>>
【转】结构体struct相关知识
查看>>
Tensorflow的基础用法
查看>>
AFNetworking+Python+Flask+pyOpenSSL构建iOS HTTPS客户端&服务器端
查看>>