Back to the top

Stunning jQuery animations

post_teaser

Only a few years ago, when you think about animation on the internet, the first tool that come to mind is Flash. This is not the case today. It has only been in the past couple of years that JavaScript and the frameworks built around it have really matured into languages that neatly support basic animation. With several JavaScript frameworks available, jQuery is quickly becoming a favorite. If you are interested in using jQuery for animated effects, here are stunning examples of jQuery animations!

Building an Animated Cartoon Robot with jQuery

robot

View Demo

Go to Tutorial

jQuery Solar System

solar-system

View Demo

Impressive Animated Landscape Header with jQuery

landscape-header

View Demo

Go to Tutorial

Simulate Gravity With jQuery

gravity

View Demo

Go to Tutorial

Auto-Moving Parallax Background

starry-night

View Demo

Go to Tutorial

Enjoy This Post?

About Nikola Lazarevic

Web Designer, Blogger, M.Sc in Electronic Engineering from Nis, Serbia. Founder of webexpedition18.com. You can find me on Twitter.

14 Comments So Far

  • Awesome effects. Thanks for putting all these up – quite inspiring.

    Reply
    ferrisoxide
    14. Jun. 2009.

  • Great list…

    Reply
    Srinivas Tamada
    14. Jun. 2009.

  • this is ROCKNROLL!

    Reply
    Hezi
    14. Jun. 2009.

  • Sadly, all of them run extremely slow on this machine (Atom 330 dual core 1.6Ghz / Firefox 3) which means that it will long time before javascript even think replacing flash.

    Reply
    Dimitris
    14. Jun. 2009.

  • It’s so slooowww

    Reply
    evgeny
    15. Jun. 2009.

  • You guys must have some really crappy computers because they run just fine on my super old iBook.

    Reply
    Bobby Marko
    16. Jun. 2009.

  • The gravity example is amazing!

    Reply
    Todd
    16. Jun. 2009.

  • Hi. I thought I’d share a couple more little web animations done with jQuery, using Glimmer from MIX Online:

    http://visitmix.com/Lab/glimmer
    http://thunderkick.us

    Reply
    Tim Aidlin
    16. Jun. 2009.

  • Lol Bobby is right, I have quite an outdated mac and they runs perfectly fine for me.

    Reply
    Tyler
    16. Jun. 2009.

  • Tim thanks for mentioning Glimmer! It looks great

    Reply
    colaja
    16. Jun. 2009.

  • oops! There doesn’t accept UTF8.
    I said “IINJYANAI” in lang => “jp”.
    Great samples and tutorials !!!
    Thanks.

    Reply
    tknv
    17. Jun. 2009.

  • These are somewhat impressive, but I’ve seen much better JS animations on http://www.chromeexperiments.com/. The starfield is pretty nice, but the gravity demo in particular is nothing special.

    Reply
    Evan Kroske
    17. Jun. 2009.

  • Cool effects, I think I will use the parallax background scroller for one of my projects :-)

    Reply
    Jack
    26. Jun. 2009.

  • Great examples, Great Works

    Reply
    Rashid Rupani
    28. Jan. 2010.

Leave Your Comment