var menuWho;
var menuWhat;

window.addEvent('domready', function(){
    var status = {
        'true': 'open',
        'false': 'close'
    };
    
    //--horizontal
    var menuWho = new Fx.Slide('menu1', {
        mode: 'horizontal',
        duration: 500
    });
    var menuWhat = new Fx.Slide('menu2', {
        mode: 'horizontal',
        duration: 500
    });
    menuWho.hide();
    menuWhat.hide();
    menuWho.hide();
    menuWhat.hide();
    
    $('parent1').addEvent('mouseenter', function(e){
        menuWhat.slideOut();
        menuWho.slideIn();
    });
    
    $('parent1').addEvent('mouseleave', function(e){
        menuWho.slideOut();
        
    });
    
    $('parent2').addEvent('mouseenter', function(e){
        menuWho.slideOut();
        menuWhat.slideIn();
        
    });
    
    $('parent2').addEvent('mouseleave', function(e){
        menuWhat.slideOut();
    });
    
    // When Horizontal Slide ends its transition, we check for its status
    // note that complete will not affect 'hide' and 'show' methods
    menuWho.addEvent('complete', function(){
        //alert("done");
    });
    
    
    
});

function toggleImage(img, newSrc){
    img.src = newSrc;
}