使元素固定在网页中，不需要用到JS的，只需要用到CSS样式就可以了。
使用css 中的 position:fixed fixed是相对于浏览器的定位，设置了这个样式的元素将不会随页面滚动而改变位置，固定在屏幕中。
如 ：
.classname {
position:fixed
left:0
top:0
z-index:9999
}
以下代码已经实现了需要的功能，导航条固定在了网页的顶部，这个主要是使用position:fixed，然后将top值设置为0即可。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>固定在窗口顶部</title> <style type="text/css">*{padding:0px
margin:0px}body, ul, li{
background-color:white
font-size:12px
font-family:Arial, Helvetica, sans-serif
text-align:center}#main{
width:20px
height:1000px
margin:0px auto
background-color:#CCC}#nav{
width:500px
margin:0px auto
position:fixed/*固定作用*/
top:0px
left:490px
/*ie6下样式，加下划线表示只针对ie6 的hack */
_position:absolute/* 把导航栏位置定义为绝对位置 关键*/
_top:expression(documentElement.scrollTop + "px") /* 把导航栏位置放在浏览器垂直滚动条的顶端 关键 */
z-index:9999 /* 让导航栏浮在网页的高层位置，遇到flash和图片时候也能始终保持最外层 */
text-align:left}a{
color:#000000
text-decoration:none}.menu{
width:120px
height:18px
margin:0px 4px 0px 0px
background-color:#F5F5F5
color:#999999
border:1px solid #EEE8DD
padding:6px 0px 0px 0px
overflow-y:hidden
cursor:hand
display:inline
list-style:none
font-weight:bold
float:left}</style></head><body><div id="nav">
<ul>
<li class="menu"><a href="#">前台专区</a></li>
<li class="menu"><a href="#">后台专区</a></li>
<li class="menu"><a href="#">交流专区</a></li>
</ul></div><div id="main">大家拖动滚动条下吧 我很长 这样就能看到导航栏固定的效果了 </div></body></html>
//记录导航条原来在页面上的位置var naviga_offsetTop = 0
var naviga_offsetLeft = 0
//IE7不识别getElementsByClassName，为了兼容自定义一个
function my_getElementsByClassName(class_name) {
var el = []
//获取所有元素
_el = document.getElementsByTagName('*')
//通过className刷选
for (var i=0i<_el.lengthi++ ) {
if (_el[i].className == class_name ) {
el[el.length] = _el[i]
}
}
return el
}
//导航条，悬停在顶部
function naviga_stay_top(){
var a_navigation_bar = []
if(document.getElementsByClassName){//Chrome, FF
a_navigation_bar = document.getElementsByClassName("navigation")
} else {//IE
a_navigation_bar = my_getElementsByClassName("navigation")
}
var scrollTop = document.body.scrollTop || document.documentElement.scrollTop
document.title = scrollTop
//如果向下滚动的距离大于原来导航栏离顶部的距离
//直接将导航栏固定到可视区顶部
if( scrollTop >naviga_offsetTop ){
a_navigation_bar[0].style.top = 0 + "px"
} else {
//如果向下滚动的距离小原来导航栏离顶部的距离，则重新计算导航栏的位置
a_navigation_bar[0].style.top = (naviga_offsetTop - scrollTop) + "px"
}
}
//给导航条上四个tab，加上点击事件。
window.onload=function(){
var a_tabs = []
if( document.getElementsByClassName ){//Chrome, FF
a_tabs = document.getElementsByClassName("tab")
}else{ //IE
a_tabs = my_getElementsByClassName("tab")
}
var a_contents = []
if( document.getElementsByClassName ){//Chrome, FF
a_contents = document.getElementsByClassName("content")
}else{//IE
a_contents = my_getElementsByClassName("content")
}
//获取offsetLeft，即导航栏离左边框的距离
var a_main_div = []
if( document.getElementsByClassName ){//Chrome, FF
a_main_div = document.getElementsByClassName("main")
}else{ //IE
a_main_div = my_getElementsByClassName("main")
}
naviga_offsetLeft = a_main_div[0].offsetLeft
a_tabs[0].onclick=function(){
window.scrollTo(0, a_contents[2].offsetTop)
}
a_tabs[1].onclick=function(){
window.scrollTo(0, a_contents[3].offsetTop)
}
a_tabs[2].onclick=function(){
window.scrollTo(0, a_contents[4].offsetTop)
}
a_tabs[3].onclick=function(){
window.scrollTo(0, a_contents[5].offsetTop)
}
//获取页面上，导航条到顶部的位置
var a_navigation_bar = []
if(document.getElementsByClassName){//Chrome, FF
a_navigation_bar = document.getElementsByClassName("navigation")
} else {//IE
a_navigation_bar = my_getElementsByClassName("navigation")
}
//获取offsetTop
naviga_offsetTop = a_navigation_bar[0].offsetTop
a_navigation_bar[0].style.left = naviga_offsetLeft + "px"
//给滚动条以及鼠标加上滚动事件
if( window.attachEvent) //IE
{
window.attachEvent("onmousewheel", naviga_stay_top)
window.attachEvent("onscroll", naviga_stay_top)
document.attachEvent("onmousewheel", naviga_stay_top)
document.attachEvent("onscroll", naviga_stay_top)
} else {//Chrome ,FF
window.addEventListener("mousewheel", naviga_stay_top,false)
window.addEventListener("scroll", naviga_stay_top,false)
document.addEventListener("mousewheel", naviga_stay_top,false)
document.addEventListener("scroll", naviga_stay_top,false)
}
}
