完美解决IE6中fixed抖动问题的方法
我们可以通过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; /* 文件不存在亦可以,随便命名 */
}
完美解决IE6中fixed抖动问题的方法的更多相关文章
- 完美解决 IE6 position:fixed 固定定位问题
关于 position:fixed; 属性 生成绝对定位的元素,相对于浏览器窗口进行定位. 元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定. pos ...
- jquery返回顶部和底部插件和解决ie6下fixed插件
(function($){ //返回顶部和底部插件 $.fn.extend({ goTopBootom:function (options){ //默认参数 var defaults = { &quo ...
- 解决PNG图片在IE6中背景不透明方法_解决IE6中PNG背
解决PNG图片在IE6中背景不透明方法_解决IE6中PNG背 目录 解决代码 解决png图片在html中 解决png作为网页背景-css 1.解决PNG图片在IE6中背景不透明的CSS与JS代码 ...
- 解决IE中img.onload失效的方法
解决IE中img.onload失效的方法 - CoffeeCat's IT Blog - IT博客 http://www.cnitblog.com/CoffeeCat/archive/2008/02/ ...
- 完美解决IE6不支持position:fixed的bug
示例代码: <!DOCTYPE html><html><head><meta http-equiv="Content-Type" cont ...
- js完美解决IE6不支持position:fixed的bug
详细内容请点击 <!DOCTYPE html><html><head><meta http-equiv="Content-Type" co ...
- 解决IE6中 PNG图片透明的终极方案-八种方案!
“珍惜生命,远离IE6”,IE6中的bug令很多Web前端开发人员实为头疼,因此不知道烧了多少脑细胞,在众多的Bug中最令人抓狂的就是IE对png图片的不支持,导致设计师和重构师放弃了很多很炫的效果, ...
- 解决 scroll() position:fixed 抖动、导航菜单固定头部(底部)跟随屏幕滚动
一.导航栏或者页脚正常情况下固定在页面的相应位置,当页面滚动后,导航栏或者页脚固定在页面的顶部或者底部的情景 一般就是将该块的代码样式的position设置为fixed.固定在顶部的话,将top设置为 ...
- 解决ie6中png图片格式不兼容问题
在IE6中对图片格式png24支持度不高,如果使用的图片格式是png24,则会导致透明效果无法正常显示 解决方法: 1.可以使用png8来代替png24,即可解决问题,但是使用png8代替png24以 ...
随机推荐
- Redis 安全
我们可以通过 redis 的配置文件设置密码参数,这样客户端连接到 redis 服务就需要密码验证,这样可以让你的 redis 服务更安全. 实例 我们可以通过以下命令查看是否设置了密码验证: 1 ...
- jdbc连接池中c3p0的配置文件的详解以及在在java中如何使用
<c3p0-config> <!-- 默认配置,如果没有指定则使用这个配置 --> <default-config> <property name=" ...
- JSONP与JSON的关系
这篇文章<说说JSON和JSONP,也许你会豁然开朗>写得非常棒,推荐一下 http://kb.cnblogs.com/page/139725/ (大神,对不起,我记录一下,因为你写的真得 ...
- [转]W3C 验证 there is no attribute target for this element
http://validator.w3.org/ 本文转自:http://hi.baidu.com/linkbestlove/item/d7fff865aefa5f0ba1cf0f04 我们要在新窗口 ...
- (转载)Java NIO:NIO原理分析(二)
NIO中的两个核心对象:缓冲区和通道,在谈到缓冲区时,我们说缓冲区对象本质上是一个数组,但它其实是一个特殊的数组,缓冲区对象内置了一些机制,能够跟踪和记录缓冲区的状态变化情况,如果我们使用 ...
- 1172 Hankson 的趣味题
1172 Hankson 的趣味题 2009年NOIP全国联赛提高组 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题解 题目描述 Descrip ...
- 蓝牙 CoreBluetooth
baseK(相关基础知识)蓝牙常见名称和缩写 BLE:(Bluetooth low energy)蓝牙4.0设备因为低耗电,也叫BLEperipheral,central:外设和中心设备,发起链接的是 ...
- ORACLE之PACKAGE
刚学pl/sql编程,写了两个package.pkg_temp_fn和pkg_temp_fn2.内容涉及pl/sql基本语法,游标,存储过程(in,out),函数(有返回值). pkg_temp_fn ...
- js解析json读取List中的实体对象示例
1.由后台action 传给前台是需要将map 转成json格式 复制代码代码如下: Map<String, List> resultMap: JSONObject json = JSON ...
- Servlet之创建与配置
上篇已将介绍完了,下面来实践操作走一个: 首先在名为"com.caiduping"的包中创一个MyFilter的对象: 1 package com.caiduping; 2 3 i ...