jquery-sectionsnap.js

jQuery plugin that will snap to next section after user scrolles over a HTML single page view, by Roman Kühl.

Example

Check out the example.
HTML:

<script src="jquery.js" type="text/javascript"></script>   <script src="jquery-sectionsnap.js" type="text/javascript"></script> <div class="sections-wrapper"> 	<div class="section"> ... </div> 	<div class="section"> ... </div> 	<div class="section"> ... </div> </div>

JS:

$(document).ready(function() { 	$(".sections-wrapper").sectionsnap(); });

Options

delay time delay (ms)
selector selector (default ".section")
reference [0-1] % of window height from which we start snaping (default .9)
animationTime snap scrolling animation time (ms)
offsetTop offset top (no snap before scroll reaches this position)
offsetBottom offset bottom (no snap after bottom - offsetBottom) JS:

$(document).ready(function() { 	$(".sections-wrapper").sectionsnap({ 		delay 			: 100 		, selector 		: '.section' 		, reference 	: 1 		, animationTime : 600 		, offsetTop 	: 100 		, offsetBottom 	: 80 	}); });