引用 关于IE6不支持position:fixed的解决办法
IE6不支持“position:fixed;”，解决这个bug的办法有两种，一种是CSS方法，另外一种是JS方法。
下面先介绍CSS解决办法：
html{overflow:hidden;}
body{height:100%;overflow:auto;}
固定的内容{position:absolute;} 示例中为：.fixed{position:absolute;}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body{ margin:0px; padding:0px; font-size:12px; line-height:22px;}
p{ margin:0px; padding:36px;}
.fixed{ position:fixed; right:60px; top:100px; border:#666666 3px solid; background-color:#CCCCCC; padding:26px;}
</style>
<!--[if IE 6]>
<style type="text/css">
html{overflow:hidden;}
body{height:100%;overflow:auto;}
.fixed{position:absolute;}
</style>
<![endif]-->
<title>position_fixed测试</title>
</head>
<body>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<div class="fixed">我的位置是固定的！拉动滚动条看效果。</div>
</body>
</html>
解决方法二：JavaS
var n=100; //top值
var obj=document.getElementById("fixed"); //position:fixed对象
window.on
window.on
示例如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body{ margin:0px; padding:0px; font-size:12px; line-height:22px;}
p{ margin:0px; padding:36px;}
.float2{ position:absolute; padding:26px; border:#999999 3px solid; background-color:#3399FF; right:200px; top:200px;}
.fixed{ position:absolute; right:60px; top:100px; border:#666666 3px solid; background-color:#CCCCCC; padding:26px;}
</style>
<script language="javas
window.on
var n=100; //top值
var obj=document.getElementById("fixed"); //position:fixed对象
window.on
window.on
}
</script>
<title>position_fixed测试</title>
</head>
<body>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<div class="float2">浮动的内容2</div>
<div class="fixed" id="fixed">我的位置是固定的！拉动滚动条看效果。</div>
</body>
</html>
运行效果后发现，一切正常，唯一一点不足之处就是滚动条拉动的过程中，固定块内容会有点闪。
再附上一个固定内容在右下角的例子：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body{ margin:0px; padding:0px; font-size:12px; line-height:22px;}
p{ margin:0px; padding:36px;}
.float2{ position:absolute; padding:26px; border:#999999 3px solid; background-color:#3399FF; right:200px; top:200px;}
.fixed{ position:absolute; right:0px; bottom:0px; border:#666666 3px solid; background-color:#CCCCCC; padding:26px; height:26px;}
</style>
<script language="javas
window.on
var obj=document.getElementById("fixed"); //position:fixed对象
var n=document.documentElement.clientHeight-obj.offsetHeight; //top值
window.on
window.on
}
</script>
<title>position_fixed测试</title>
</head>
<body>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<p>测试内容.........</p>
<div class="float2">浮动的内容2</div>
<div class="fixed" id="fixed">我的位置是固定的！拉动滚动条看效果。</div>
</body>
</html>
