Minimal One Page Navigator Plugin With jQuery - scrollMiniMenu

File Size: 4.27 KB
Views Total: 2180
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Minimal One Page Navigator Plugin With jQuery - scrollMiniMenu

scrollMiniMenu is a super tiny plugin for automatically generating a side navigation that displays the content section you're viewing on and allows to scroll smoothly through all different sections by click. Great for one page scrolling website and single page web application.

How to use it:

1. Import the jQuery scrollMiniMenu plugin's stylesheet and script into your jQuery project.

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

2. Add the CSS style 'pageToScroll' to page sections like this:

<div class="page section-1 pageToScroll"></div>

<div class="page section-2 pageToScroll"></div>

<div class="page section-3 pageToScroll"></div>

<div class="page section-4 pageToScroll"></div>

3. That's it. The plugin will look up the content sections with the CSS class 'pageToScroll' and then automatically generate a sticky navigation on the right hand side of the webpage.

Change log:

2016-02-02

  • Update scrollMiniMenu.js

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