Demo of Fade Behavior

Fade Down, then Back Up

Here's an example that fades the image to 50% in 1 second, then fades back up to 100% (opaque) in 1/4 seconds.

// select the image with id='avatar'
$proto('#avatar', {

  Click: {
    // when they click
    onClick: {
      // fade it to 50% slowly
      Fade: {
        opacity: {to: 0.5},
        duration: 1.0,

        // when that finishes, fade it back up to 100% quickly
        onComplete: {
          Fade: {
            opacity: {to: 1.0},
            duration: 0.25
          }
        }
      }
    }  
  }
});

For a full description of this behavior see the Fade Documentation Page.