对于 IE6 也可以使用纯 CSS 来实现 position:fixed 的效果。直接上代码吧。
先是结构。

1
2
3
4
5
    <div class="container">
        我是IE6,使用 absolute 模拟 fixed.</br>
        这里多多复制几个,效果明显。
    </div>
    <div class="fixed"></div>

然后是 CSS。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
        body {
            height:100%;
            overflow-y:auto;
            padding:0px;
            margin:0px;
        }
        .container {
            height:1800px;
            background:#CCC;
        }
        .fixed {
            position:fixed;
            top:50px;
            left:50px;
            background:red;
            height:50px;
            width:50px;
        }

还有对于 IE6 来说,加一个单独的样式

1
2
3
4
5
6
7
8
   <!--[if lte IE 6]>
        <style type="text/css">
            html {overflow-x:auto; overflow-y:hidden;}
            .fixed {
                position:absolute;
            }
        </style>
    <![endif]-->

原理就是对于 body 设置高度 100%,html 垂直方向上,超出高度给隐藏掉。然后里面的内容自己滚动,而 absolute 的相对于浏览器窗口的话,因为浏览器窗口就那么大,又不滚动,所以 absolute 看起来就 fixed 了。

但是这个有个问题,就是 所有设置了 absolute 和 relative 的元素,都会表现为 fixed 的,所以还是有副作用的。不过可以用来做遮罩层。

例子可以使用 IE6 浏览器访问。

仅作记录,原文地址:
http://blog.mozilla.org/webdev/2009/02/20/cross-browser-inline-block/

IE7:

1
2
3
display: inline-block;
*display: inline;
zoom: 1;

三者缺一不可。

IE6 :

1
2
3
4
display: inline-block;
zoom: 1;
*display: inline;
_height: 250px;

常用的 JavaScript 检测浏览器为 IE 是哪个版本的代码。包括是否是最人极端厌恶的 ie6 识别与检测。

1
2
3
4
5
6
7
8
9
10
11
12
13
var isIE=!!window.ActiveXObject;
var isIE6=isIE&&!window.XMLHttpRequest;
var isIE8=isIE&&!!document.documentMode;
var isIE7=isIE&&!isIE6&&!isIE8;
if (isIE){
    if (isIE6){
        alert("ie6");
    }else if (isIE8){
        alert("ie8");
    }else if (isIE7){
        alert("ie7");
    }
}

然后是一个稍微短的 js 判断是否 ie 的方法:
这个貌似是利用 IE 中 JScript所特有的条件编译(或曰条件注释)来区分 IE 和非 IE(这里的IE/非IE均是针对内核而言,以IE为内核的浏览器将视为IE)

1
var ie = 0/*@cc_on+1@*/;

一个最短的 js 判断 ie 或非 ie 的代码,大小仅仅 7bytes:

1
var ie = !+'\v1';

2010年1月,一位俄国人利用了IE与标准浏览器在处理数组的toString方法的差异,仅6bytes就完美完成了是否IE浏览器的检测:

1
var ie = !-[1,];

利用这些发现,我们可以使代码写的更短。如今检测是否为 IE6 其实可以写成:

1
var ie6=!-[1,]&&!window.XMLHttpRequest;

之前那大段累赘的分析 navigator,然后正则比较的方式,后面的 js 方法是不是效率更高了!

来源:
1. http://biancheng.dnbcw.info/javascript/101495.html
2. http://dean.edwards.name/weblog/2007/03/sniff/
3. http://feilong.org/shortest-ie6-judge-means