jQuery Plugin To Auto Show Site Navigation On Scroll Up - topbar

topbar is a smart jQuery sticky navigation plugin that automatically displays the site header navigation sliding down from the top when you scroll up the webpage.

How to use it:

1. Load the following files into your webpage. Make sure you also add the jQuery JavaScript library.

<link rel="stylesheet" href="topbar.css">
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="topbar.js"></script>

2. Create the sticky navigation menus as shown below:

<nav
  class="topbar"
  data-topbar
  data-topbar-fixed="#topbar-fixed"
>
  ... site navigation here ...
</nav>

<nav class="topbar-fixed" id="topbar-fixed">
  ... fixed navigation here ...
</nav>

3. Initialize the plugin and the topbar is ready for use.

$('[data-topbar]').topbar();

---

This awesome jQuery plugin is developed by eumatheusgomes. For more Advanced Usages, please check the demo page or visit the official website.