Demo of Keypress Behavior

Key events are generally a mess because of cross browser issues as well as scoping keys to specific elements. To keep it simple this example sets the target to the top level ('document'). We wait for the 'f' key to be pressed. When it is we switch the target to our image avatar and fade it out.

To see it in action, press the f key

You can click here to restart the example.

$proto('document', {
  Keypress: {
    key: 'f',
    onKeypress: {
      Fade: {
        target:'#avatar',
        opacity: {to: 0},
        onComplete: {Close : {} }
      }
    }  
  }
});

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