Pływające menu navbar ze zmianą koloru tła

Witam

Chciałbym uzyskać efekt zmiany tła paska navbar zaraz po rozpoczęciu scrollowaniu strony

<nav>
    <div class="container">
        <div class="row">
            <div class="col-sm-12">
           <section id="navbar">
                <ul>
                    <li><a href="#section1">HOME</a></li>
                    <li><a href="#news">NEWS</a></li>
                    <li><a href="#contact">CONTACT</a></li>
                </ul>
            </section>
            </div>
        </div>
    </div>
</nav>

#nabvar {
    justify-content: center;
    padding: 30%;
    position: fixed;
}

Menu już podąża za przewijaniem tylko problem mam uzyskaniem zmiany tła. W jaki sposób mogę uzyskać? Czy może się obyć bez JS?

Zerknij tutaj : https://stackoverflow.com/questions/23706003/changing-nav-bar-color-after-scrolling