How to change default scrollspeed,scrollamount,scrollinertia of a webpage

Question

I am tring to change the the default scrolling speed,amount and inertia of a webpage.I google a lot,but in vain

Fortunately,later,this day,I found a plugin which all

Answer 1

Why not wrap your HTML in a container div and target that, like this:

<div class="container">
  <div id="I-WILL-APPLY-ONLY HERE" class="I-WILL-APPLY-ONLY HERE">
<!-- Content here -->
  </div>
</div>

Then target your container class in the jQuery:

$('.container').mCustomScrollbar...

Answer 2

You can use jQuery to do that, take a look in my fiddle: http://jsfiddle.net/promatik/NFk2L/

You may add an event listener of the scroll event, be aware that you may prevent the Default action of the scroll ... if (event.preventDefault) event.preventDefault();

Then the handler of that event, using jQuery animate, will perform the scroll ...

function handle(delta) {
    var time = 1000;
    var distance = 300;

    $('html, body').stop().animate({
        scrollTop: $(window).scrollTop() - (distance * delta)
    }, time );
}

You can set the time, distance (and you can also add an easing method), see the full example in the fiddle

Answer 3

My adapt to smooth on element working: Codepen

$('.smooth').on('mousewheel', function(e){
  wheel(e.originalEvent, this)
})

function wheel(event, elm) {
    var delta = 0;
    if (event.wheelDelta) delta = event.wheelDelta / 120;
    else if (event.detail) delta = -event.detail / 3;

    handle(delta, elm);
    if (event.preventDefault) event.preventDefault();
    event.returnValue = false;
}

function handle(delta, elm) {
    var time = 1000;
      var distance = 100;

    $(elm).stop().animate({
        scrollTop: $(elm).scrollTop() - (distance * delta)
    }, time );
}