Fix Menu Bar At The Top While Scrolling Down (Codings)

Illustration in a Notepad 

STEP 1  

<style type="text/css"> Copy The Below CSS Code Here</style> 

  and then copy the above code with tags in Notepad. 

    h1 {height: 200px; } .sp { /* this make our menu fixed top */ z-index: 9999; position: fixed; left: 0; top: 0; width: 100%; }

STEP 2 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" type="text/javascript">  </script>  <script type="text/javascript"> Enter The Below Code Here </script>

and then copy the above code with tags in Notepad below CSS code.

jQuery("document").ready(function($){ var nav = $('.Ss'); var pos = nav.offset().top; $(window).scroll(function () { var fix = ($(this).scrollTop() > pos) ? true : false; nav.toggleClass("sp", fix); }); });

STEP 3

Copy the below code and paste it below CSS &  Jquery  Code in Notepad.

<h1> </h1> <div class="Ss"> <div class="nav"> <ul> <li> <a href=""> Menu I </a> </li> <li> <a href=""> Menu II </a> </li> <li> <a href=""> Menu III </a> </li> </ul> </div> </div> </div>

Your Fix Menu Bar is ready to work . In order to check whether it is working or not , write some long contents in it 
and save as using .html extension