改變親和有源元件的父的父的造型，使用fullPage.js回調

Question

我有利用fullPage.js（https://github.com/alvarotrigo/fullPage.js）以及用於部分之間導航工具條菜單的位點，所以用戶可以使用用鼠標滾輪移動或選擇邊欄上的部分。

當用戶滾動時，當前活動的菜單部分將突出顯示。但是，在第2節菜單擴展顯示5個主題分組爲2個分類。我希望子分類以及部分被標記爲活動以及主題。

這裏是我到目前爲止，使用jQuery的例子： http://jsfiddle.net/rwde78ts/1/

即時通訊使用的回調「afterSlideLoad」來稱呼改變了有源元件的兩個母公司的CSS功能（子catagory）和父母家長（該部分）將他們標記爲活動。

繼承人的代碼，我到目前爲止，這是行不通的：

afterSlideLoad: (function(){ 
      $(".active").parent().css("color", "black"); 
      $(".active").parent().parent().css("color", "black"); 
     }) 

沒有人知道我在做什麼錯？

Answer 1

要快速回答您的問題，我將首先提供解決方案。

雖然這不是最好的做法，而不是幫助您瞭解設計的HTML結構和遍歷高效，快捷的方式，DOM正確的方法，它可以解決這個特定的問題。

如果一切設計得更好，這可能根本不需要Javascript，CSS將是完美的解決方案。

我不想解釋我的解決方案如何工作，所以您將有機會從中學習。

我更換了以下拖行：

afterSlideLoad:(function(){ 
    $(".active").parent().css("color", "black"); 
    $(".active").parent().parent().css("color", "black"); 
}) 

了這一點。這是打破線條，以更好的理解。 [中 - 當然，這工作在代碼了。]）：

afterLoad: function(){ 
      /* Here comes your previous code... */ 

      console.log('afterSlideLoad Changed to afterLoad'); 
      $('.inlinedColor') 
      .css('color','gray') 
      .removeClass('inlinedColor'); 

      $('li.active') 
      .prevAll('span.year') 
      .first() 
      .add(
       $('li.active') 
       .parents('li') 
       .find('>a span span') 
      ) 
      .addClass('inlinedColor') 
      .css('color','black'); 
     } 

所有上述可在這裏：http://jsfiddle.net/rwde78ts/10/

如果沒有設法弄清楚你自己，不要猶豫，問，所以我可以逐行解釋。