需要滾動條上的自動菜單項的幫助

Question

我在滾動條上的自動菜單項有問題。由於我的標題包含2個菜單，因此它看起來像：MENU 1 < LOGO> MENU 2;所以我一直在使用這個腳本：

// Cache selectors 
var topMenu = $(".main-nav1"), 
    topMenuHeight = topMenu.outerHeight()+15, 
    // All list items 
    menuItems = topMenu.find("a"), 
    // Anchors corresponding to menu items 
    scrollItems = menuItems.map(function(){ 
     var item = $($(this).attr("href")); 
     if (item.length) { return item; } 
    }); 

// Bind to scroll 
$(window).scroll(function(){ 
    // Get container scroll position 
    var fromTop = $(this).scrollTop()+topMenuHeight; 

    // Get id of current scroll item 
    var cur = scrollItems.map(function(){ 
    if ($(this).offset().top < fromTop) 
     return this; 
    }); 
    // Get the id of the current element 
    cur = cur[cur.length-1]; 
    var id = cur && cur.length ? cur[0].id : ""; 
    // Set/remove active class 
    menuItems 
    .parent().removeClass("active") 
    .end().filter("[href=#"+id+"]").parent().addClass("active"); 
});​ 

是否有可能以某種方式使用2個菜單在這個腳本？我的課程是.main-nav1和main-nav2。我真的需要jQuery幫助，因爲我是這個語言的新手！

Answer 1

看代碼，只有改變這一基本路線很可能是必要的：

menuItems = topMenu.add($('.main-nav2')).find('a'), 

我只能看到使它多一點可讀性後：

var topMenu = $('.main-nav1'), 
topMenuHeight = topMenu.outerHeight()+15, 
menuItems = topMenu.add($('.main-nav2')).find('a'), 

scrollItems = menuItems.map(function() { 

    var item = $($(this).attr('href')); 

    if (item.length) return item; 
}); 

$(window).scroll(function() { 

    var fromTop = $(this).scrollTop()+topMenuHeight, 

    cur = scrollItems.map(function() { 

     if ($(this).offset().top < fromTop) 
     return this; 
    }); 

    cur = cur[cur.length-1]; 
    var id = cur && cur.length ? cur[0].id : ''; 

    menuItems 
    .parent().removeClass('active').end() 
    .filter('[href=#'+id+']').parent().addClass('active'); 
});