function getYpos (htmlElement) {

    var yPos = 0;

    while (htmlElement != null) {
        yPos += htmlElement.offsetTop;
        htmlElement = htmlElement.offsetParent;
    }

    return parseInt(yPos, 10);
};

function getXpos (htmlElement) {   
     
    var xPos = 0;
    while (htmlElement != null) {    
        xPos += htmlElement.offsetLeft;
        htmlElement = htmlElement.offsetParent;
    }
    
    return parseInt(xPos, 10);
}

function hideMenu (subMenuId) {

    if (subMenuId) {
        var subMenu = document.getElementById(subMenuId);
        subMenu.style.visibility = 'hidden';
    }
}

function addChildFunction(children) {

    for (index = 0; index < children.length; index++) {

        children[index].onmouseover = function() { this.firstChild.style.color = '#ffffff'; };            
        children[index].onmouseout = function() { this.firstChild.style.color = '#019dda'; };
    }    
}

function showMenu (parent, subMenuId) {

    if (subMenuId) {
        var subMenu = document.getElementById(subMenuId);

        subMenu.style.top = ((getYpos(parent) + parseInt(parent.offsetHeight, 10)) + 'px');
        subMenu.style.left = ((getXpos(parent)) + 'px');
        subMenu.style.visibility = 'visible';

        subMenu.onmouseover = function() {
            hideMenu(this.id);
        };

        addChildFunction(subMenu.getElementsByTagName('li'));
    }
}

function menuSelected (menuControl, subMenuId) {

    if (menuControl.firstChild.style)
    	menuControl.firstChild.style.color = '#ffffff';

    showMenu(menuControl, subMenuId);
}

function menuDeselected (menuControl, subMenuId) {

    if (menuControl.firstChild.style)
	menuControl.firstChild.style.color = '#019dda';

    hideMenu(subMenuId);
}