网页制作

ie6 position:fixed解决方案
网页制作 2024/11/15 佚名
3 2
可是要在IE6中实现固定效果，position: fixed;就不奏效了。
目前我所知的ie6下fixed的方案大概有纯css和expression+js两种，各有利弊。
1.纯css法
利用了ie6下html元素外面套的一个匿名元素，即 * ，利用选择器层级，可以定制ie6下的效果。代码如下

复制代码代码如下:
* html {
overflow-y: hidden;}/*只是定制垂直滚动fixed*/
* html body{
overflow-y: auto;
height: 100%;
}
* html #fixedbox{ /*把要固定的元素position设置为absolute */
position: absolute;
}

此法看似成本很低，其实有个显而易见的致命伤，就是ie6下所有position: absolute; 的元素都会被置为固定不动。于此，此法只能用于页面木有绝对定位的元素的时候。

2.js 法
其实此法原理也很简单，就是在ie6下利用js不断改变absolute的元素scrolltop值，已达到类似固定的效果。例如

复制代码代码如下:
#fixedbox{
position: fixed;
top: 250px;
/* for ie6 */
_position: absolute;
_top: expression(documentElement.scrollTop + 250 +”px”);
}

此法也有一个小问题，即滚动时会闪烁。
解决闪烁的办法也很简单，即给滚动元素的父元素（一般是body）设置一个background-image,并把background-attachment设置为fixed。
于是，综上，

复制代码代码如下:
#fixedbox{
position: fixed;
top: 250px;
}
/*for ie6 */
* html body{
background-image: url(about:blank);
background-attachment: fixed;
}
* html #fixedbox{
position: absolute;
top: expression(documentElement.scrollTop + 250 +”px”);
}

虽然expression会影响一定的性能，但这也不失为一种好的模拟fixed的方法。
ps：如果本身body中要设置background-image的，可以直接在html里写空的固定的背景图。
标签：
position,fixed
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
岱庙资源网 Copyright www.zgmyg.com

评论“ie6 position:fixed解决方案”

暂无“ie6 position:fixed解决方案”评论...
www.zgmyg.com 岱庙资源网
129,905影音资源
244,626技术资源
111,817软件资源
578,645站长资源

更新日志

友情链接

杰晶网络 DDR爱好者之家 桃源资源网 杰网资源 富贵资源网 南强小屋 铁雪资源网 幽灵资源网 万梅资源网 狼山资源网 白云岛资源网 昆仑资源网 相思资源网 明霞山资源网 内蒙古资源网 黑松山资源网 茶园资源网 饿虎岗资源网 大旗谷资源网 常春岛资源网 岱庙资源网 兴国资源网 快活林资源网 蝙蝠岛资源网 帝王谷资源网 白云城资源网 伏龙阁资源网 清风细雨楼 天枫庄资源网 圆月山庄资源网 无争山庄资源网 神水资源网 移花宫资源网 神剑山庄资源网 无为清净楼资源网 金钱帮资源网 丐帮资源网 华山资源网 极乐门资源网 小李飞刀资源网 凤求凰客栈 风云阁资源网 金狮镖局 鸳鸯亭资源网 千金楼资源网 更多链接
岱庙资源网 Copyright www.zgmyg.com