jQuery Plugin For Cross-browser Smooth Scrolling Behavior - srSmoothscroll

File Size: 7.02 KB
Views Total: 2268
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin For Cross-browser Smooth Scrolling Behavior - srSmoothscroll

A lightweight, cross-browser jQuery plugin that lets you implement the configurable smooth scrolling behavior on a specific container or the entire window. It is a great scroll behavior polyfill for those browsers which don't support smooth scrolling natively.

How to use it:

1. Load the needed jQuery library and jQuery MouseWheel plugin in your html page.

<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/jquery.mousewheel.min.js"></script>

2. Download the load the JavaScript file 'jquery.simplr.smoothscroll.js' after jQuery.

<script src="jquery.simplr.smoothscroll.js"></script>

3. The JavaScript to activate the smooth scrolling effect on the whole body.

$.srSmoothscroll()

4. The JavaScript to activate the smooth scrolling effect on a scrollable container.

<div id="container">
  <div id="widget">
    <p>content here</p>
  </div>
</div>
$.srSmoothscroll({
  target: $('#widget'),
  container: $('#container')
})

5. Set the step size on each mouse scroll.

$.srSmoothscroll({
  step: 55
})

6. Set the scrolling speed in milliseconds.

$.srSmoothscroll({
  speed: 400
})

7. Set the easing function.

$.srSmoothscroll({
  ease: 'swing'
})

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