jQuery Easing Plugin

This is a plugin to give pre 1.1 jQuery alternative easing capabilities, as of 1.1 things changed in jquery simplifying a lot of the process, so I simplified the plugin. Get the latest version here

A jQuery plugin from GSGD to give advanced easing options. Uses Robert Penners easing equations for the transitions.

Useage

Standard

This plugin overwrites the default fx function. If you just want slightly nicer easing, include it after jQuery. Default method is inout. All standard effects will then use the nicer equations

$(element).slideUp();

All the effects behave in exactly the same way, so once you've plugged in, all your old scripts will just work.

Custom

You can also choose your own method (the main reason for the plugin), I've hijacked the speed function so use the following.

$(element).slideUp({duration: 1000, easeMethod: method});

duration: is basically speed, so milliseconds or slow/fast will work here.

methods: takes an ease method or a custom easing function in the following format

function(t, b, c, d) { ... easing code goes here ... } 

where t = current time b = start value c = end value d = duration

Download jquery.easing.1.0e.js here

This has the basic easein, easeinout, easeout

Optional equations

These are the extra equations, packaged as a separate file.

Download jquery.easing.extensions.js here

Bonus feature

jQuery.easing() is the function that does the hard work. All your scripts can now use this. Call from some kind of time based loop as follows:

jQuery.easing(current_time, start_value, end_value, total_time, [easeMethod])

The Penner functions don't like negative values, so this is how I use it in practice

z.now = (firstNum < lastNum) ? 
	firstNum + jQuery.easing(current_time, 0, (lastNum - firstNum), duration, easeMethod) :
	firstNum - jQuery.easing(current_time, 0, (firstNum - lastNum), duration, easeMethod);

So basically, check if we're greater than or less than, and then work forwards / backwards from there

Examples

toggle

easein

toggle

easeinout

toggle

easeout

toggle

expoin

toggle

expoinout

toggle

expoout

toggle

bouncein

toggle

bounceinout

toggle

bounceout

toggle

elasin

toggle

elasinout

toggle

elasout

toggle

backin

toggle

backinout

toggle

backout

© 2006 GSGD