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

本文共 1035 字,大约阅读时间需要 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次以上的计算量。

由此可见一斑。

posted on
2017-06-21 11:38 阅读(
...) 评论(
...)

转载于:https://www.cnblogs.com/mthoutai/p/7058756.html

你可能感兴趣的文章
记录cmder安装和更换背景图
查看>>
PS完美破解安装
查看>>
const函数
查看>>
第一天开通博客园
查看>>
HDU1754(线段树)
查看>>
如何去掉HTML5Viewer中的滚动条
查看>>
并查集 分类: 并查集 2015-07-09 16:...
查看>>
Oracle数据文件迁移
查看>>
ORACLE基本操作
查看>>
KernelZ02_尝试过程
查看>>
NGUIJoysticK
查看>>
JavaScript之DOM转Jquery对象
查看>>
Windows下Redis安装及使用
查看>>
《程序员修炼之道》读后感02
查看>>
[转]虚拟现实和现实增强技术带来的威胁
查看>>
Typecho 新浪登陆插件 Sinauth
查看>>
个人进度(13)
查看>>
将数据绑定到combobox的方法
查看>>
操作Git中出现的问题,记录
查看>>
《断章》----卞之琳
查看>>