simplr-smoothscroll
DEMO
Requirements
Usage
$(function () { $.srSmoothscroll({ // defaults step: 55, speed: 400, ease: 'swing', target: $('body'), container: $(window) }) })
Enable scrolling for specific widgets
See this example
<div id="container1"> <div id="widget1"> <p>lorem ipsum</p> </div> </div> <div id="container2"> <div id="widget2"> <p>lorem ipsum</p> </div> </div>
#container1 { width: 500px; height: 300px; overflow: auto; } #container2 { width: 500px; height: 300px; overflow: auto; }
$(function () { $.srSmoothscroll({ target: $('#widget1'), container: $('#container1') }) $.srSmoothscroll({ target: $('#widget2'), container: $('#container2') }) })
Browser and os detection
Browsers that support smooth scrolling natively may be excluded.
$(function () { var platform = navigator.platform.toLowerCase(); if (platform.indexOf('win') == 0 || platform.indexOf('linux') == 0) { if ($.browser.webkit) { $.srSmoothscroll(); } } });
This will enable simplr-smoothscroll only for webkit browsers on windows and linux.