Animating size

This shows how to animate the width & height of an element. In this example, clicking on the image will cause it to grow by 10 pixels (in both dimensions) in about 1/10 seconds and then shrink back to original size in the same amount of time. You can click here to restart the example.

$proto('img#avatar', {
  Click: {
    onClick: {
       Animate: {
          height: {by: 10},
          width : {by: 10},
          duration: 0.1,
          onComplete: {
            Animate: {
               height: {by: -10},
               width : {by: -10},
               duration: 0.1
           }
         }
       }
    }
  }
});