<!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
ml; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{ margin:0px auto; padding:0px; font-family:微软雅黑; font-size:14px;}
#aa{ width:100%; height:50px; background-color:#66C; margin-top:0px;}
</style>
</head>
<body>
<div id="aa">
</div>
<div style="width:100px; height:1000px"></div>
</body>
<script type="text/javascript">
//取出DIV相对于页面上方的距离
var p = document.getElementById("aa").offsetTop;
//窗体的滚动事件
window.onscroll = function () {
//取出当前页面的滚动距离
var t = document.documentElement.scrollTop || document.body.scrollTop;
if(t>p)
{
document.getElementById("aa").style.position = "fixed";
document.getElementById("aa").style.width = "500px";
document.getElementById("aa").style.height = "20px";
}
else if(t==p)
{
document.getElementById("aa").style.position = "fixed";
document.getElementById("aa").style.width = "100%";
document.getElementById("aa").style.height = "50px";
}
}
</script>
<
html>
