$(document).ready(function(){


    

    showActive();

    function showActive(){
        var active = $(".active").html();
        active = $("img[alt*='"+active+"']");
        active.css("margin-top","-144px");
        active.show();
        active.animate({
            marginTop:"0px"
        },500)
    }

    function isActive(val){
        if($(val).hasClass("active"))
            return true;
        return false;
    }

    $(".nav").hover(function(){
        if(isActive(this))
            return false;
        var val = $(this).html();
        var img = $("img[alt*='"+val+"']");
        img.css("margin-top","-144px");
        img.show();
        img.animate({
            marginTop:"0px"
        },500)
        return true;

    },function(){
        if(isActive(this))
            return false;
        var val = $(this).html();
        var img = $("img[alt*='"+val+"']");
        img.css("margin-top","0px");
        img.show();
        img.animate({
            marginTop:"-144px"
        },500);
        return true;        
    })

})