How to make Sticky navigation

Hello Readers !

Below is an example of sticky navigation with simple script which is compatible with internet

explorer. You can use this script for sticky header or sticky footer.

I hope it will be helpful for you.

Script:-

    $(document).ready(function(){
    $(window).scroll(function(){
    if($(this).scrollTop() > 1){
    $('nav').addClass('sticky')
    }
    else($('nav').removeClass("sticky"))
    });
    });

Css:-

    section{width: 900px;margin: 0 auto}
    footer , header{height: 120px;background-color: #ccc}
    main{height: 900px}
    nav{background-color: #333;}
    nav ul{background-color: #e5e5e5;list-style: none;}
    nav ul li{display: inline-block;}
    nav ul li a{color: red;}
    .sticky{position: fixed;top:0px;width:900px}

Html :-

    <section>
    <header id="header">
    </header>
    <main>
    <nav>
    <ul>
    <li><a href="" title="">Navigation1</a></li>
    <li><a href="" title="">Navigation</a></li>
    </ul>
    </nav>
    </main>
    <footer>
    </footer>
    </section>
For such more blogs kindly visit http://findnerd.com/NerdDigest