Smooth Page Scrolling Plugin With jQuery - smoothPageScroll

smoothPageScroll is a lightweight jQuery one page scroll plugin which enables the anchor links to scroll the webpage to desired points smoothly. Supports horizontal, vertical and diagonal scrolling effects. Easing effects are supported as well.

How to use it:

1. Put jQuery library and the jQuery smoothPageScroll plugin's script in the footer of the webpage.

<script src="//code.jquery.com/jquery-3.1.0.min.js"></script>
<script src="jquery.smoothPageScroll.js"></script>

2. Include the jQuery easing plugin for additional easing effects.

<script src="jquery.easing.1.3.min.js"></script>

3. Create an anchor link pointing a specific container where you want to scroll to.

<a href="#section">Link</a>

<div id="section">
  ...
</div>

4. Active the plugin with one JS call.

$('a[href^="#"]').smoothPageScroll();

5. Default config options.

$('a[href^="#"]').smoothPageScroll({

  // easing type
  easing: 'easeOutQuart',

  // scrolling speed
  speed: 1000,

  // scrolling delay
  delay: 0,

  // specify the target container
  target: undefined,

  // fired after the scroll is complete
  complate: function (){},

  // add hash to url
  isAddHash: true,

  // vertical scroll
  isTopScroll: true,

  // horizontal scroll
  isLeftScroll: true
  
});

Change log:

2016-09-03

• fix target to currentTarget

---

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