<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>

<script>

$(document).ready(function(){

//滾動條發生滾動

$(window).scroll(function(){

var top=$(document).scrollTop();

var menu=$("#menu");

var items=$("#contant").find(".item");

var currentId="";//當前所在的樓層

? ? ? ? ? ? items.each(function(){

? ? ? ? ? ? var m=$(this);

? ? ? ? ? ? var itemTop=m.offset().top;

? ? ? ? ? ? if(top>itemTop-200){

? ? ? ? ? ? currentId="#" + m.attr("id");

? ? ? ? ? ? }else{

? ? ? ? ? ? return false;

? ? ? ? ? ? }

? ? ? ? });

? ? ? ? ? ? //給相應樓層的a設置current，取消其他連接的current

? ? ? ? ? ? var currentLink = menu.find(".current");

? ? ? ? ? ? if(currentId && currentLink.attr("href") != currentId){

? ? ? ? ? ? currentLink.removeClass("current");

? ? ? ? ? ? menu.find("[href="+ currentId +"]").addClass("current");

? ? ? ? ? ? }

? ? });

});

</script>

我改正了 ? 為什么導航條不隨著頁面的變化而變化呀

1.你代碼是沒有問題的，只是script標簽放錯了位置。<script src="http://libs.baidu.com/jquery/1.9.1/jauery.js"></script>這行代碼是引入jquery。然后再把

??$(document).ready(function(){

? ? $(window).scroll(function(){

? ? ? ? var top=$(document).scrollTop();

? ? ? ? var menu=$('#menu');

? ? ? ? var items=$('#content').find(".item");

? ? ? ? var currentId="";

? ? ? ? items.each(function(){

? ? ? ? ? ?var m = $(this);?

? ? ? ? ? ?var itemTop=m.offset().top;

? ? ? ? ? ?if(top > itemTop){

? ? ? ? ? ? currentId="#" + m.attr("id");

? ? ? ? ? ?}else{return false;}

? ? ? ? });

? ? ? ? var currentLink=menu.find(".current");

? ? ? ? if(currentId && currentLink.attr("href") != currentId){

? ? ? ? ? ? currentLink.removeClass("current");

? ? ? ? ? ? menu.find("[href=" + currentId + "]").addClass("current");

? ? ? ? }

? ? });

? ?});?

放在<script></script>中即可。

2.

if(currentId && currentLink.attr("href") != currentId){

? ? ? ? ? ? currentLink.removeClass("current");

? ? ? ? ? ? menu.find("[href=" + currentId + "]").addClass("current");

? ? ? ? }

? ? })

這段代碼的作用是給當前選中樓層設置current 并且取消其他樓層的current樣式。currentId 是實際應該選中樓層的id，當頁面沒有滾動時，currentId為空。currentLink.attr("href") != currentId是當前頁面顯示選中的樓層不等于實際應該選中的樓層。也就是說當頁面發生滾動，并且當前頁面顯示的選中樓層和實際應該選中的樓層不一致時進入該循環。?currentLink.removeClass("current");先把所有的樓層的選中樣式都清空，menu.find("[href=" + currentId + "]").addClass("current");通過currentId找到該樓層，并把選中樣式current給該樓層。