Demo of Mouseover Behavior

Toggle Style Class on Mouseout and Mouseover

When the mouse enters the avatar then set the style class to the 'over' style class (solid blue) and when the mouse leaves set it to the 'not-over' style classes (dotted blue).

$proto('#avatar', {
  Mouseover: {
    onMouseover: {
      ReplaceClass: {
        removeClass: 'not-over',
        addClass: 'over'
      }
    }  
  },
  Mouseout: {
    onMouseout: {
      ReplaceClass: {
        removeClass: 'over',
        addClass: 'not-over'
      }
    }  
  }
});

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

Behavior Demos