Minimalist jQuery Smooth Scroll To Plugin - Smooskroll

File Size: 4.82 KB
Views Total: 816
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Minimalist jQuery Smooth Scroll To Plugin - Smooskroll

Smooskroll is an ultralight (~1kb) jQuery smooth scroll plugin which enable the visitor to smoothly scroll the webpage to desired point by anchor links.

How to use it:

1. Include jQuery library and the jQuery smooskroll script on your webpage.

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="smooskroll.js"></script>

2. Include the jQuery easing plugin for easing effects while scrolling.

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>

3. Create an anchor link pointing to the target point.

<a href="#target" class="scroll">Scroll to target</a>

4. Open the smooskroll.js to modify the parameters.

var topPadding = 40, // padding-top in px
    speed = 2, // X px per ms
    currentLocation = $(window).scrollTop(),
    targetLocation = target.offset().top - topPadding,
    distance = Math.abs(currentLocation - targetLocation),
    time = distance / speed;
$('html,body').animate({
    scrollTop: targetLocation
}, time, 'easeOutCubic'); // easing option

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