simplr-smoothscroll

DEMO

Requirements

jquery-mousewheel

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.