CODEWITHSUNDEEP
javascriptjqueryscrolleasing-functionsjquery-easing
Mohammad
Mohammad

Reputation: 7418

How to implement JQuery easing into this window scroll movement function?

With this code I've been able to capture the mousewheel movement and apply it to the horizontal scroll bars instead of the vertical default.

$('html').bind('mousewheel', function(event, delta) {
   window.parent.scrollBy(-120 * delta, 0);
   return false;
});

Is there any way that I could add this jQuery easing animation to the scroll movement?

// t: current time, b: begInnIng value, c: change In value, d: duration
jQuery.extend( jQuery.easing, {
   easeInOutBack: function (x, t, b, c, d, s) {
        if (s == undefined) s = 1.70158; 
        if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
        return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
   }
});

Thank you so much in advance!

Upvotes: 8

Views: 1894

Answers (1)

nathan gonzalez
nathan gonzalez

Reputation: 11987

i think what you need is the scrollTo plugin. seems to fit the bill, though i haven't used it personally. basically should be able to call it like this

$.scrollTo( -120*delta, {duration:1000,easing:'easeInOutBack',axis:'x'} )

find the plugin demo here. the jquery plugin site appears to be offline currently, but when its back up, the plugin can be found here

Upvotes: 1

Related Questions