完美解决IE6中fixed抖动问题的方法
2015-05-29 00:00
411 查看
我们可以通过position:fixed来实现元素的固定效果,如网页中底部的"回到顶部菜单",底部的toolbar,对联广告等等,可惜fixed属性在IE6及以下是不支持的。通常的作法,我们用JS或者IE表达式来达到这个效果。
如:
可惜,又遇到一个问题,页面滚动的时候,会出现抖动现象.
如果解决呢?
无意中发现我们momo社区的左侧导航栏在IE6下页面滚动时候居然不抖动,看了下CSS,和上面的表达式没有任何区别呀。。。
于是对HTML和CSS进行最简化删除,最终发现,原来是body属性中设置了背景图片刚好解决了这个抖动的问题!
body中设置了一个样式:
上网搜了下,居然已经有人这样通过这个办法解决,顺便还找到了另一个解决方法,总结如下:
方法1
方法2
如:
.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; /* 文件不存在亦可以,随便命名 */
}
相关文章推荐
- javascript跨域解决方案
- DISCUZ! X2.5设置仅允许QQ登录注册论坛 加固会员注册机制
- PHPCMS v9栏目添加字段及描述编辑器修改方法
- linux zip/unzip命令
- PHPCMS 错误日志 Only variables should be passed by ...
- 解决Twitter Bootstrap Tab URL链接问题
- 浏览器兼容CSS代码:按钮文字垂直居中(input button text vertical align)
- MySQL数据库的热备份和冷备份
- 自从用了Less 编写css,你比以前更快了~(sublime编译)
- css 填坑常用代码分享
- JAVA获取当前日期以及将字符串转成指定格式的日期
- phpcms v9 打开网站特别慢 增加数据库缓存方法
- 在Intellij IDEA或者PhpStorm下用X-debug调试PHP
- 增加p()函数,方便开发中对变量打印调试
- FireFox不支持InnerText的解决方法
- j2ee中如何拦截jsp页面?
- JQuery淡入淡出 banner切换特效
- isMobile 一个简单的JS库,用来检测移动设备
- 手持移动端特殊链接:打电话,发短信,发邮件
- 采集/自动登录啊都可以用这两个方法实现 asp.net