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
jQuery Solar System
Impressive Animated Landscape Header with jQuery
Simulate Gravity With jQuery
Auto-Moving Parallax Background
Tell Us What You Think
Please leave your comment about this post on the comment section below. If you liked it tell your friends by tweeting it. You can also subscribe to our feed by rss or email.
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.
Awesome effects. Thanks for putting all these up – quite inspiring.
14. Jun. 2009.
Great list…
14. Jun. 2009.
this is ROCKNROLL!
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.
14. Jun. 2009.
It’s so slooowww
15. Jun. 2009.
You guys must have some really crappy computers because they run just fine on my super old iBook.
16. Jun. 2009.
The gravity example is amazing!
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
16. Jun. 2009.
Lol Bobby is right, I have quite an outdated mac and they runs perfectly fine for me.
16. Jun. 2009.
Tim thanks for mentioning Glimmer! It looks great
16. Jun. 2009.
oops! There doesn’t accept UTF8.
I said “IINJYANAI” in lang => “jp”.
Great samples and tutorials !!!
Thanks.
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.
17. Jun. 2009.
Cool effects, I think I will use the parallax background scroller for one of my projects
26. Jun. 2009.
Great examples, Great Works
28. Jan. 2010.
Bubble Engine – Plugin for jQuery
The Bubble Engine makes soap bubbles on your websites. And without the need of Adobe Flash! Bubble Engine is a free plugin for jQuery.
Exciting combinations of bubble effects or whether reassuring stylish upgrade of isolated bubbles. With the free plug-in for jQuery, you can configure absolutely free, to look like your animation.
At the project site will tell you in detail how you can integrate and configure the plugin.
In the five demonstration sites you can see the effects Impressive Live, and even produce a demo with Live controller as many Bubble sources, move freely and configure.
Let rise a couple of times but like Bubbles!
PROJECT:
http://www.soyos.net/bubble-engine-plugin-for-jquery.html
DEMO:
http://www.soyos.net/tl_files/demos/bubbles/
Greetings,
Chris
14. Jul. 2010.
Great plugins! Flash is obsolete, I think. Las Vegas Web Design
9. Aug. 2010.