好多页面都有用到这种效果，大概就是不论页面上下如何滚动，固定不动的元素不随页面滚动，代码如下：
<!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" /> <title>无标题文档</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script> <style type="text/css"> .clear{ clear:both;} .main{ width:600px; margin:0 auto;} .left{ width:395px; float:left; background:#066; height:1000px; text-align:center; font:bold 20px/30px Arial, Helvetica, sans-serif; color:#FFF;} .right{ width:195px; float:right; background:#C36; height:300px;} #fixed{ position:fixed; background:#000; font:bold 26px/56px "微软雅黑"; color:#FFF; text-align:center; margin:0 auto; width:195px;} </style> </head> <body> <div class="main"> <div class="left"> 1<br /> 2<br /> 3<br /> 4<br /> 5<br /> 6<br /> 7<br /> 8<br /> 9<br /> 10<br /> </div> <div class="right"> <div id="fixed">我不懂</div> </div> <div class="clear"></div> <script> $(function(){ $(window).scroll(function(){ if($(document).scrollTop()>10){ $('#fixed').css('top','0'); } else{ var _top = 10 -$(document).scrollTop() ; $("#fixed").css("top",_top+'px'); } }) }) </script> </div> </body> </html>