How to make animated websites with javascript

I hve seen a couple of really cool websites that are animated with javascript. Google have done a few animated interactive logos and this site too is animated with javascript 开发者_如何学C(not the flash bit clearly).

Well how to do it? Is there some tool, framework etc that people use? I only know of jquery.

---

Here's the rulebook: http://api.jquery.com/animate

Here's the playground: http://jsfiddle.net

Have fun.

---

jQuery is the best framework to use as a base. It handles all the cross-browser idiosyncrasies.

Check out jQuery UI.

http://jqueryui.com/demos/

---

If your audience is newer, you should also consider CSS 3 Transitions.

 .animated {
   transition: all 0.3s linear;
   -webkit-transition: all 0.3s linear;
   -moz-transition: all 0.3s linear;  
   -o-transition: all 0.3s linear;
 }

Changing a style property for any element with this class will transition to its new property. E.g. adjusting "margin-left" from 0px to 100px will cause a slide to the right; adjusting "background-color" from "red" to "blue" will cause a cool color-change effect. Give it a go!

For browser compatibility, check out caniuse-- transitions. Happy coding!

---

I prefer SVG for interactive graphics, if you prefer Vector Graphics. I would suggest using Adobe Illustrator or something similar to produce the graphics and then use Raphael to animate it. If you want a really good introduction, go for the really good PeepCode Episode.

---

From examining their source it looks like volll rolled their own method of animation using javascript.

If you want to make graphical animations on your own site I would suggest having a look at the HTML5 canvas tag. https://developer.mozilla.org/en/Canvas_tutorial