Попадая JQuery и CSS эффекты перехода, работающие вместе

Question

Я клонировали этот шаблон:

http://ironsummitmedia.github.io/startbootstrap-grayscale/ 

При прокрутке вниз, обратите внимание, что цвет фона из заголовка-ссылки (О, скачать, контакт) на вершине изменится на серый цвет (в зависимости от раздела, в котором вы прокрутили).

Я внес небольшие изменения в заголовок wherien. Я включаю шрифты-удивительные значки. Однако цветовой эффект прекратился.

<ul class="nav navbar-nav nav-advance-options hide-this-nav"> 
<!-- Hidden li included to remove active class from about link when scrolled up past about section --> 
    <li class="hidden"> 
     <a href="#page-top"></a> 
    </li> 
    <li> 
     <a class="page-scroll" href="#flax"> 
      <i class="fa fa-leaf"></i> 
     </a> 
    </li> 
    <li> 
     <a class="page-scroll" href="#moist"> 
      <i class="fa fa-heart"></i> 
     </a> 
    </li> 
    <li> 
     <a class="page-scroll" href="#designs"> 
      <i class="fa fa-paw"></i> 
     </a> 
    </li> 
</ul> 

http://plnkr.co/edit/0MV3QzRpJcPWlpuNMDav

Answer 1

Я не могу точно сказать, где ваш Javascript не ладится на активы вы предоставили, но вопрос в том, что на удивительный значок шрифта версии сайта (http://plnkr.co/edit/0MV3QzRpJcPWlpuNMDav), класс active не добавляется в меню li элементов на свитке, тогда как он добавляется к элементам li на демо-сайте (http://ironsummitmedia.github.io/startbootstrap-grayscale/).

Answer 2

решить проблему путем удаления следующие строки из второй ул:

<li class="hidden"> 
       <a href="#page-top"></a> 
      </li> 

Я не знаю, почему это решает проблему еще. Если кто-то понимает, любезно объясните