bahavior.js

MyApp.MyBehavior = SC.Behavior.extend({

    target: 'MyApp',
    action: 'doSomething',
    
    initialHandler: 'mouseUpNotOver',
    
    mouseUpNotOver: SC.Handler.extend({
        mouseEntered: 'mouseUpOver'    
        // no class name applied (in active)
    }),
    
    mouseUpOver: SC.Handler.extend({      
      classNames: 'hover',
      mouseDown: 'mouseDownOver'
    }),
    
    mouseDownOver: SC.Handler.extend({
        classNames: 'active over',
        mouseExited: 'mouseDownOut',        
        mouseUp: function(evt) {
            return this.performAction();
        }
    }),
    
    mouseDownOut: SC.Handler.extend({        
        classNames: 'active out',
        mouseEntered: 'mouseDownOver'
    })

});