$(function(){
    initDropDown('aboutusdropdown', 'aboutus');                  
    initDropDown('servicesdropdown', 'services');                  
});

function initDropDown(dropdownid, tabid){
    $('#' + dropdownid + ' ul li a').width($('#' + dropdownid).width());
    offsetx = $('#' + tabid).position();      
    $('#' + dropdownid).css('margin-top', '30px');
    $('#' + dropdownid).css('padding-top', '4px');   
    $('#' + dropdownid).css(offsetx);
    $('#' + tabid + ' *').bind("mousemove click", function(e){                
        openDropDown(dropdownid, tabid);
    });  
}

function openDropDown(dropdownid, tabid){  
    // I would like to make the drop down hide faster than 500ms, 
    // but the show(500) will finish after and both drop downs end up showing                        
    $('.dropdown:not(#' + dropdownid + ')').hide(500);   
    //$.each($('.dropdown:not(#' + dropdownid + ')'), function() {
        //window.alert(this.id);
        //if ($(this).css('display') == 'block'){
        //    $(this).css('display', 'none');    
        //}    
    //});  
    if($('#' + dropdownid).css('display') == 'none'){            
        $('#' + dropdownid).show(500,function(){
            $("body").bind("mousemove",function(e){       
                hideDropDown(e, dropdownid, tabid);    
            }) 
        });                                                      
        $('#' + tabid + ' a').css('background-image',"url('./img/template/hovertab.gif')");  
        $('#' + tabid + ' p').css('background-image',"url('./img/template/hovertab.gif')");  
    }                                           
}

function hideDropDown(e, dropdownid, tabid){
    var $target = $(e.target);                      
        if ($('#' + dropdownid)) {                                                  
            if(!(lcIsMouseOver('#' + dropdownid, e)) && !(lcIsMouseOver("#" + tabid, e))){   
                $("body").unbind("mousemove");   
                //$('#' + dropdownid).hide(500);    
                $('#' + tabid + ' a').css('background-image',""); 
                $('#' + tabid + ' p').css('background-image',""); 
                  
                // hide all drop downs, will this be a problem?
                $('.dropdown').hide(500);                            
            } 
        };   
}   

function lcIsMouseOver(item, e) {
    var MyMouseOver = false;
    var offsetx = $(item).offset();
    offsetx.right = offsetx.left + $(item).outerWidth(); 
    offsetx.bottom = offsetx.top + $(item).outerHeight();    
    //alert(e.pageX + ':' + e.pageY + ' div=' + offsetx.left + ':' + offsetx.top + ' -> ' + offsetx.right + ':' + offsetx.bottom);
    if ((e.pageX > offsetx.left) && (e.pageX < offsetx.right) &&
        (e.pageY > offsetx.top) && (e.pageY < offsetx.bottom)) {
        MyMouseOver = true;        
    }
    return MyMouseOver;
}