<script type="text/javascript">
jQuery(document).ready(function() {
//Calculate the height of <header>
//Use outerHeight() instead of height() if have padding
var aboveHeight = jQuery('#top').outerHeight();
// when scroll
jQuery(window).scroll(function(){
//if scrolled down more than the header's height
if (jQuery(window).scrollTop() > aboveHeight){
// if yes, add "fixed" class to the <header>
// add padding top to the #content (value is same as the height of the header)
jQuery('.nav-wapper').addClass('top_nav').css('top','0').next().css('padding-top','80px');
} else {
// when scroll up or less than aboveHeight, remove the "fixed" class, and the padding-top
jQuery('.nav-wapper').removeClass('top_nav').next().css('padding-top','0');
}
});
jQuery(".scrolltop").click(function(){
jQuery("html, body").animate({ scrollTop: 0 }, 1200);
return false;
});
});
</script>



样式表里边插入以下样式：

.top_nav {
position: fixed;
}