解决IE6下Position：fixed问题

原文地址：http://hi.baidu.com/guodong828/blog/item/c52d3e34ab879b315bb5f54a.html

参考地址：http://www.wxwdesign.cn/article/skills/ie6_position_fixed_debug.htm

 

 

 

在IE6.0及以下版本的浏览器里是不支持position：fixed。而在IE7，IE8，firefox，opera，chrome都可以完美的支持此特性的。解决此问题的要点主要有：

1).容器要有一个背景图片

2).设置它的滚动属性为fixed。

3).用IE特有的e­xpression方法计算出元素的top，left,right,bottom的量。

1 <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
2   < html xmlns ="http://www.w3.org/1999/xhtml" >
3   < head >
4 < meta http-equiv ="Content-Type" content ="text/html; charset=gb2312" />
5 < title > IE6 fixed </ title >
6 < style type ="text/css" >
7 *
8 {
9 margin : 0px ;
10 padding : 0px ;
11 }
12 body {
13 _background-image : url(about:blank) ; /* 用浏览器空白页面作为背景 */
14 _background-attachment : fixed ; /* prevent screen flash in IE6 确保滚动条滚动时，元素不闪动 */
15 }
16
17 #topNav {
18 width : 980px ;
19 z-index : 100 ; /* 设置浮动层次 */
20 overflow : visible ;
21 position : fixed ;
22 top : 50px ; /* 其他浏览器下定位，在这里可设置坐标 */
23 _position : absolute ; /* IE6 用absolute模拟fixed */
24 _top : expression(documentElement.scrollTop + 50 + "px") ; /* IE6 动态设置top位置 */
25 /* documentElement.scrollTop 设置浮动元素始终在浏览器最顶，可以加一个数值达到排版效果 */
26 background-color : #0000FF ;
27 height : 31px ;
28 }
29 .show {
30 position : absolute ;
31 top : 500px ;
32 left : 400px ;
33 border : #ff0000 1px solid ;
34 }
35 </ style >
36 </ head >
37 < body >
38 < div class ="jd_menu" id ="topNav" > 1111 </ div >
39 < br />< br />< br />< br />< br />< br />< br />< br />< br />
40 < br />< br />< br />< br />< br />< br />< br />< br />< br />
41 < br />< br />< br />< br />< br />< br />< br />< br />< br />
42 < br />< br />< br />< br />< br />< br />< br />< br />< br />
43 < br />< br />< br />< br />< br />< br />< br />< br />< br />
44 < br />< br />< br />< br />< br />< br />< br />< br />< br />
45 < br />< br />< br />< br />< br />< br />< br />< br />< br />
46 < br />< br />< br />< br />< br />< br />< br />< br />< br />
47 < br />< br />< br />< br />< br />< br />< br />< br />< br />
48 < br />< br />< br />< br />< br />< br />< br />< br />< br />
49 < br />< br />< br />< br />< br />< br />< br />< br />< br />
50 < div class ="show" > show </ div >
51 < p >
52 　利用给 < body > 设置固定的背景，防止滚动条滚动时的闪动；如果 < body > 中要设置滚动的背景而产生冲突，可以把代码写在html选择器里面，如：
53 html {
54 _background-image: url(about:blank);
55 _background-attachment: fixed; /* prevent screen flash in IE6 */
56 }
57 body {
58 background-image: url(1.jpg);
59 background-attachment: scroll;
60 }
61 </ p >
62 </ body >
63 </ html >
64

转载于:https://www.cnblogs.com/aji88/archive/2010/05/31/1747973.html