Mar 7, 2011

Animate to CSS class in jQuery using animate function

Now you can directly use classes instead of separate CSS parameters in JS for animate function. In case same animation to multiple objects, or complex animation you can just use animate to class.
Keep presentation where it should be (in linked or inline CSS class definitions) and just animate to and from CSS classes.

Now, you can write:
$('div').animate('.myCssSelectedClass');
instead of:
$('div').animate({
    height: '100px',        //expand down
    opacity: 1              //fade in
//  ...                     //etc, etc.
})
    .find('a')              //now animate the anchor elems inside
        .animate({
            top: 100px,
            left: 100px     // slide in from upper left
//          ...             // etc, etc.
        })
        .end()
    .find('p')              //and the paragraph elems
        .animate({
            top: 200px      // slide in from the top
//          ...             // etc, etc.
        })
//          ...             // and on and on

DOWNLOAD

No comments:

Post a Comment

Test post after a long time

i want to see the post