Затухание навигационной панели начальной загрузки при прокрутке, при изменении цвета текста

поэтому я работаю над приложением Ruby on Rails с предоставленным мне дизайном, который требует, чтобы панель навигации была прозрачной в верхней части страницы, а затем плавно переходила в сплошной белый после прокрутки вниз мимо certian<section> на странице, в то же время, текст ссылки на панели навигации вверху белый, а в то же время - серый<section>.

Я изучил JavaScript, который изменяет непрозрачность при прокрутке, но мне не удалось заставить его работать. Я полагаю, что те же функции, которые переходят в панель навигации в белый цвет, также будут работать с переходами ссылок панели навигации в серый цвет.

Я также изучил плагин .affix js [на Bootstrap, но я не знаю очень продвинутого javascript, чтобы изменить его в соответствии с моими потребностями. В случае, если это полезно, структура navbar в представлении моего приложения начинается с:

<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div>
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="/">
        <%= image_tag "logo-small.png" %>
      </a>

... "render partial" lines depending on if the user is logged in or not ...

Любая помощь приветствуется! Мне бы очень хотелось, чтобы этот дизайн заработал, и я уже сделал большую часть этого, эта конкретная часть поставила меня в тупик. Любая помощь приветствуется!

Ответы на вопрос(3)

Ваш ответ на вопрос