nav active class不會因爲列表中的圖像而工作

Question

我已創建jsfiddle以幫助查看工作代碼。

我一直在嘗試實現粘性菜單，該菜單會自動更改活動列表項的顏色。但我現在在中心添加一個圖像作爲列表項之一。

不知何故，它破壞了導航代碼。

我也有一個代碼，這是假設使img去margin-top：-29％;當人滾動超過50像素。由於某種原因，它不會出現在jsfiddle上，但可以工作。

起初我以爲是第二個腳本是衝突它。然後我注意到它在第三個列表項上打破了。

我在做什麼打破它？我不太清楚爲什麼它應該打破代碼的勢頭。有人能指導我嗎？

PS：這可能會或可能不會幫助，但我也得到這個錯誤在控制檯上

Uncaught TypeError: Cannot read property 'top' of undefined 

Uncaught TypeError: Cannot read property 'top' of undefined (index):543 
(anonymous function) (index):543 
p.event.dispatch jquery.min.js:2 
g.handle.h 

線543是從腳本

var divPos = $(theID).offset().top; // get the offset of the div from the top of page 

這個錯誤是可見的，不論這個問題我我正在尋求幫助，但通常不會影響我的用戶體驗。

我對JavaScript的知識很基礎，我無法真正理解我是如何破壞代碼的。請幫忙！

編輯： 我試圖消除圖像，它工作正常here

感謝jtorrescr我已經能夠實現我需要什麼，但現在我面對的固定誤差在控制檯上

Uncaught Error: Syntax error, unrecognized expression: 
Z.error 
bg 
Z.compile 
bm 
h.querySelectorAll.bm 
Z 
p.fn.extend.find 
p.fn.p.init 
p 
(anonymous function) 
p.event.dispatch 
g.handle.h 

//for the js line 
var divPos = $(theID).offset().top; // get the offset of the div from the top of page 

Answer 1

你的問題是，代碼假定你將與<ul>中的所有元素進行交互。通過添加一個額外的元素和最重要的避免與它交互，你需要改變你的代碼。這是你能一起工作的解決方案：代碼http://jsfiddle.net/Ap4QM/25/

只需添加一個，如果排除您要使用的元素：

for (var i=0; i < aArray.length; i++) { 
        if(aArray[i]!='index.php') 
        { 
         var theID = aArray[i]; 
         var divPos = $(theID).offset().top; // get the offset of the div from the top of page 
         var divHeight = $(theID).height(); // get the height of the div in question 

          if (windowPos >= divPos && windowPos < (divPos + divHeight)) { 
           $("a[href='" + theID + "']").addClass("nav-active"); 
          } else { 
           $("a[href='" + theID + "']").removeClass("nav-active"); 
          } 
        } 
       } 

做更加靈活，你可以問的ID，並與合作它而不是索引，所以你可以把它作爲作業