Submit your widget

lightweight Section Scroll with jQuery

Created 10 months ago   Views 9861   downloads 1130    Author imdanishiqbal
lightweight Section Scroll with jQuery
View DemoDownload 126.8 KB
22
Share |

Section Scroll is a lightweight jQuery plugin for automatically generating a side bullet navigation on your one page scrolling website. Click on the navigation to scroll smoothly through different sections, automatically selects the correct navigation items.

HTML

INCLUDE

<!-- -----Styles----- -->
<link rel="stylesheet" type="text/css" href="css/section-scroll.css">


<!-- -----Scripts----- -->
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.0.min.js">


<!-- This is optional, if you want to use easings then please include jquery.easing.1.3.js. See options -->
<!-- Get it here (Please buy him a beer) http://gsgd.co.uk/sandbox/jquery/easing/-->
<script type="text/javascript" src="js/jquery.easing.1.3.js">   


<!-- Last but not least  -->           
<script type="text/javascript" src="js/jquery.section-scroll.js">

HTML

<div class="scrollable-section" data-section-title="About Us"></div> 
<div class="scrollable-section" data-section-title="Example"></div> 
<div class="scrollable-section" data-section-title="Testimonials"></div>
scrollable-section

Assign this class to each section you want to use as part of the navigation. 
 

data-section-title

Plugin picks this attribute's value to use as each menu item's title, e.g. right now it says HTML in navigation.

Read more:http://plugins.imdanishiqbal.com/section-scroll/

Tag: scroll