导航条随网页滚动代码示例，js，jquery，兼容firefox，ie，chrome
简单示意代码，已测试环境：firefox，ie，chrome
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=utf-8" /><title>fixed bar</title><script type="text/javascript" src="../jquery-1.8.0.min.js" /></script><style type="text/css">body{margin:0px;}.head{height:100px;background:#CDA;}.content{height:1000px;background:#D2F;}.fixed{height:100px;width:100px;background:#A13;position:fixed; top:10px; left:200px;}#jq_fix{height:100px;width:100px;background:#313;}</style><script type="text/javascript" >$(document).ready(function(){//滚动事件$(window).scroll(function(){//显示滚动条位置 $(".fixed").html(document.body.scrollTop||document.documentElement.scrollTop); var t = document.body.scrollTop||document.documentElement.scrollTop; //当导航条不可见时，重新定义导航条位置 if(t>100){$("#jq_fix").css({"position":"fixed","top" :"0px","left" :"0px"}); }else{ //回到导航条原来位置时，还原导航条位置$("#jq_fix").css({"position":"","top" :"","left" :""}); }});});</script></head><body><div class="head"></div><div id="jq_fix" ></div><div class="content" ><div class="fixed"></div></div></body></html>