博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
完美解决IE6中fixed抖动问题的方法
阅读量:4701 次
发布时间:2019-06-09

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

我们可以通过position:fixed来实现元素的固定效果,如网页中底部的"回到顶部菜单",底部的toolbar,对联广告等等,可惜fixed属性在IE6及以下是不支持的。通常的作法,我们用JS或者IE表达式来达到这个效果。

如:

.fixed{
position: fixed; _position: absolute; _top: expression(eval(document.documentElement.scrollTop)); }

可惜,又遇到一个问题,页面滚动的时候,会出现抖动现象.

如果解决呢?

无意中发现我们momo社区的左侧导航栏在IE6下页面滚动时候居然不抖动,看了下CSS,和上面的表达式没有任何区别呀。。。

于是对HTML和CSS进行最简化删除,最终发现,原来是body属性中设置了背景图片刚好解决了这个抖动的问题!

body中设置了一个样式:

body{
background: url(body.jpg) fixed; }

上网搜了下,居然已经有人这样通过这个办法解决,顺便还找到了另一个解决方法,总结如下:

方法1

.fixed{
position: fixed; _position: absolute; _top: expression(eval(document.documentElement.scrollTop));} html{
_text-overflow:ellipsis; }

方法2

.fixed{
position: fixed; _position: absolute; _top: expression(eval(document.documentElement.scrollTop)); } html {
_background: url(xx.jpg) fixed; /* 文件不存在亦可以,随便命名 */ }

 

转载于:https://www.cnblogs.com/wawahaha/p/3531947.html

你可能感兴趣的文章
Fear Factoring Gym - 101652P(除法分块)
查看>>
Tree POJ - 1741 (点分治)
查看>>
Too Rich UVALive - 7183(贪心)
查看>>
欧拉定理证明&阶乘的逆元
查看>>
Prime Game Gym - 101981J(网络流/二分图)
查看>>
Teamwork Gym - 101492E (dp)
查看>>
No Link, Cut Tree! Gym - 101484F(dp)
查看>>
Coprimes Gym - 101492C(bitset)
查看>>
Partial Tree UVALive - 7190(完全背包)
查看>>
『深度应用』NLP机器翻译深度学习实战课程·零(基础概念)
查看>>
『开发技术』Windows极简安装使用face_recognition实现人脸识别
查看>>
『深度应用』NLP命名实体识别(NER)开源实战教程
查看>>
『开发技术』GPU训练加速原理(附KerasGPU训练技巧)
查看>>
『深度应用』NLP机器翻译深度学习实战课程·壹(RNN base)
查看>>
『深度应用』一小时教你上手MaskRCNN·Keras开源实战(Windows&Linux)
查看>>
『王霸之路』从0.1到2.0一文看尽TensorFlow奋斗史
查看>>
『TensorFlow2.0正式版教程』极简安装TF2.0正式版(CPU&GPU)教程
查看>>
bug收集
查看>>
TCP重置报文段及RST常见场景分析
查看>>
TCP三次握手与四次分手
查看>>