Easy Fullscreen Vertical Page Scroll Plugin With jQuery - Better Scroll
File Size: | 6.66 KB |
---|---|
Views Total: | 11349 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Better Scroll is a jQuery plugin designed for singe page website that provides fullscreen vertical page scrolling with sectioned content and snaps to next section after user scrolls.
How to use it:
1. Import jQuery library and the jQuery better scroll plugin into your project.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="jquery.betterScroll.js"></script>
2. Create sections for your single page website.
<div id="demo" class="page"> <div class="page-section"> <div class="page-frame"> ... section 1 ... </div> </div> <div class="page-section"> <div class="page-frame"> ... section 2 ... </div> </div> <div class="page-section"> <div class="page-frame"> ... section 3 ... </div> </div> </div>
3. Initialize the plugin by calling the function on the parent container.
$(document).ready(function () { $('#demo').betterScroll(); });
This awesome jQuery plugin is developed by devbridge. For more Advanced Usages, please check the demo page or visit the official website.