Jacked

If you ever worked with Flash, you're certainly familiar with "onEnterFrame". requestAnimationFrameis an "onEnterFrame" for both Firefox and Chrome, and is head and shoulders better than usingsetInterval for animations. Jacked uses it by default.

CSS3 transitions are also great performance boosters in some environments. With Jacked,you can set any given browser or mobile environment to use CSS3 by default, or you can set anyindividual tween to use CSS3. Likewise, if CSS3 is the default, you can explicitly targetrequestAnimationFrame for any individual tween.

Some environments are kick ass with requestAnimationFrame. Some environments are kick ass with CSS3. With Jacked, you get the power of both.

Why use Jacked for CSS3 Transitions?

For some things like rollovers when a fallback isn't necessary, Jacked certainly isn't needed.But when a fallback is important, Jacked has you covered. And you'll have more control over yourCSS3 transitions with built-in stop methods, callbacks w/ callbackParams and more.

Why not just use Modernizr + jQuery when CSS3 fallbacks are needed?

Easy. Because even when Jacked falls back to setInterval, it's still WAY faster than jQuery.

Jacked.special(el:HTMLElement, settings:Object);Special allows a user to execute their very own function for every "step" or "onUpdate" of a tween.A good use of this function is to animate properties that aren't natively supported by Jacked.

// sample callback// The callback will be passed 3 arguments in the following order:// (el:HTMLElement, tick:Number, finished:Boolean)// tick = A number between 0-1 that represents the current tween position in the "tween"// finished = A Boollean that will pass as true when the tween is finished (i.e. tick = 1)
function(element, tick, finished) {};

$(element).stopJackedSet(true); // recursively stop tweens of all children and children's children of any given element// Let's say you had two instances of a banner rotator, but only wanted to stop all tweens// from one banner and not the other. This is where "stopJackedSet" is extremely useful.

Special Notes

Everything is Connected

This means you can combine a Static call with a jQuery call and stopAll() will stop it all.And same goes for combining requestAnimationFrame with CSS3.

Automatic Overriding

When a tween occurs, it automatically overrides any existing tweens on the same element.So although stop methods are available for Jacked, there's no need to explicitly callthem before you tween something.

Automatic jQuery Instantiation + jQuery Chaining

The jQuery plugin gets instantiated automatically if the jQuery Object is found.And all jQuery calls return the jQuery Object for chaining.

IE8 Support

Because some assholes still use it.

backgroundPosition supported, with some exceptions

Animating numbers is supported. Animating positions and percentages are not. Click here for an exampleThe HTML source of the link above has more notes about working with backgroundPosition.

Support for CSS3 properties

Anything can be animated using Jacked.special(); (see static tab for more info), but other thantransforms, all other CSS3 properties such as "box-shadow", "border-radius", etc. are not supported by the native Jacked.tween(); call.

Additional Notes

fadeIn and fadeOut work similar to jQuery. If the element's display is "none", when the tween startsit will be set to "block", or its value can be explicitly set as one of the settings options (see"settings"). Likewise, for fadeOut, when the element's opacity reaches zero its display will be setto "none".

Visibility is automatically set to "visible" for every tween.

Jacked does not compute "auto" and will translate this value as the number zero.

Feedback Welcome!

If you decide to test Jacked and have a question or comment, feel free to email me at the address below!support at codingjack dot com