The jQuery section menu plugin.
Switch branches/tags
Nothing to show
Clone or download
Latest commit eba45d1 Jun 17, 2014
Permalink
Failed to load latest commit information.
assets Add dark skin Jun 17, 2014
LICENSE Initial commit May 27, 2014
README.md Update read me Jun 14, 2014
bower.json Release 1.0.1 Jun 14, 2014
index.html Demo page Jun 9, 2014
sectionmenu.jquery.json Release 1.0.1 Jun 14, 2014

README.md

jQuery.sectionMenu

The jQuery section menu plugin creates a side menu that allows you to scroll to the different sections on the page. Check the demo for more information.

Example

HTML

<html>
	<body>
		<section id="home" data-section-menu="Home">
			<p>Home</p>
		</section>
		<section id="about" data-section-menu="About">
			<p>About</p>
		</section>
		<section id="contact" data-section-menu="Contact">
			<p>Contact</p>
		</section>
	</body>
</html>

CSS

<link rel="stylesheet" href="assets/css/jquery.sectionmenu.css" />

Javascript

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.fragmentscroll.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.sectionmenu.min.js"></script>
<script type="text/javascript">
$(window).load(function() {
	$('body').sectionMenu().fragmentScroll();
});
</script>

Options

$('body').sectionMenu({
	// Show title in the menu
	enableTitle: true,

	// Outer element
	element: 'nav',

	// Class and data- name
	class: 'section-menu',

	// Insert content before the menu
	insertBefore: '',

	// Insert content after the menu
	insertAfter: ''
});