animate.css, animation by toggling‎ css classes

CSS3 Animation example

animate.css is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.

Once jQuery launch, we make animation in web page much more easier even, we can just use lines of codes, to make beautiful transitions, animation for any DOM in our HTML markup.

Now, with animate.css, we can make the CSS even easier, again! Actually, animate.css is a set of CSS3 animation mixins functions. anitmate.css had built 58+ css 3 effects.

Usage

animate.css

$('#someElementId').addClass('animated bounceOutLeft');

jQuery

$('#animateTest')
    .animate({ left: 20}, {
        duration: 250,
        complete: function(){
            $('#animateTest').animate({
                left: '-2000px'
            })
        }
    });

Ok, feels more comfort to write animation from now on right?

Check it out

Subscription

We will send you a newsletter weekly, includes Coder Read, weekly resources summary, library / application updates & some freebies.

Related Articles