Question

hi i am playing with jquery ui effects and trying to animate some christmas ornaments. the idea is that they would swing if you hover over them. and swing from the midpoint of the top of the image (the top of the string) like a real ornament and not just the whole image moving back and forth.

what i have so far is here:
http://jsfiddle.net/9ceeW/

its displaying on click, when i do it on hover they dont work as well or realistically.

this is my first foray into jquery animation and i am not really sure how to proceed next. any help would really be appreciated.

thanks!

Answer 1

You can use the plugin from

• http://www.zachstronaut.com/posts/2009/02/17/animate-css-transforms-firefox-webkit.html
• add a custom animation queue as in A non-nested animation sequence in jQuery?
• and you end up with animated christmas balls at http://jsfiddle.net/gaby/9ceeW/8/

---

update

updated to allow multiple balls to animate at the same time.. http://jsfiddle.net/gaby/9ceeW/9/