<!-- Variables -->
var largeur = 564;
var centre = true;
var top = 74; // Variable qui positionne le menu general par rapport au top
var leftMenu = 49;
var leftMenuNotCenter = 98;
var couleurMenu = "#000099";
var couleurMenuGen = "#000099";
var couleurSeparation = "#FFFFFF";
var bgColor = true

var offsetHor = 0;
var offsetVer = 0;
var openMenu = false;
var timeId;
//var tailles = [141,131,120,141,120];
//var taillesDiv = [141,131,120,141,120];
var tailles = [114,114,114,112,112];
var taillesDiv = [170,160,160,110,110];
var actif = 0;
<!-- Variables -->

<!-- Fonction init-->
function init(a,offsetTop){
    top = top + offsetTop;
    actif	= a;
    initOffsets();
    //ecrire(initTable(largeur,centre)+initLayers());
    //	setTimeout('ecrire(initLayers())', 500);
    ecrire(initLayers());
}
function showMenu(){
    //	setTimeout('ecrire(initTable(largeur,centre))', 500);
    ecrire(initTable(largeur,centre));
}

function showMenu(largeur, bgColor){
    this.largeur = largeur;
    this.bgColor = bgColor;
    ecrire(initTable(largeur,centre));
}

<!-- Fonction qui dessine le menu general -->
function initTable(largeur, centre){
    //var largCellule = Math.round(largeur/liens.length);
    var tableau = "<table width=\""+largeur+"px\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\"";
    if (centre) tableau += " align=\"center\"";
    tableau += "><tr>";
    for (i=0;i<liens.length; i++){
        if (i != 0){
            tableau += "<td bgcolor=\""+couleurSeparation+"\" width=\"1\"><img src=\"../images/1x1_transparent.gif\" width=\"1\"></td>";
        }
        if (i==actif) {
            if (document.layers){ // Version NS
                tableau += "<td ";
                if (bgColor) tableau += " bgcolor=\""+couleurMenuGen + "\"";
                tableau += " align=\"center\" width=\""+tailles[i]+"\" class=\"menuHautBlanc\"><ilayer width=\"100%\"><layer width=\"100%\" onMouseOver=\"doHide("+i+");show('Layer"+i+"','"+i+"');\" onMouseOut=\"doHide("+i+");\"><center>"+libelles[i][0]+"</center></layer></ilayer></td>";
            }else{
                tableau += "<td ";
                if (bgColor) tableau += " bgcolor=\""+couleurMenuGen + "\"";
                tableau += " align=\"center\" width=\""+tailles[i]+"\" class=\"menuHautBlanc\" onMouseOver=\"doHide("+i+");show('Layer"+i+"','"+i+"');\" onMouseOut=\"doHide("+i+");\">" + libelles[i][0] + "</td>";
            }
        }else{
            if (document.layers){ // Version NS
                tableau += "<td ";
                if (bgColor) tableau += " bgcolor=\""+couleurMenuGen + "\"";
                tableau += " align=\"center\" width=\""+tailles[i]+"\" class=\"menuHaut\"><ilayer width=\"100%\"><layer width=\"100%\" onMouseOver=\"doHide("+i+");show('Layer"+i+"','"+i+"');\" onMouseOut=\"doHide("+i+");\"><center>"+libelles[i][0]+"</center></layer></ilayer></td>";
            } else { // Version IE
                tableau += "<td ";
                if (bgColor) tableau += " bgcolor=\""+couleurMenuGen + "\"";
                tableau += " align=\"center\" width=\""+tailles[i]+"\" class=\"menuHaut\" onMouseOver=\"doHide("+i+");show('Layer"+i+"','"+i+"');\" onMouseOut=\"doHide("+i+");\">"+libelles[i][0]+"</td>";
            }
        }

    }
    tableau += "</tr></table>";
    return tableau;
}



<!-- Fonction qui dessine les layers -->
function initLayers(){
    //largLayer = Math.round(largeur/liens.length);
    top = top +offsetVer;
    layer = "";
    leftAll = 0;
    for (i=0;i<liens.length; i++){
        left = (leftAll)+offsetHor;
        // On dessine les layers
        // Bug NS
        nameL=i;
        if(i==0) {
            nameL=78;
            leftL=left;
        }
        if (document.layers) layer += "<layer name=\"Layer"+nameL+"\" top=\""+top+"px\" left=\""+left+"px\" width=\""+taillesDiv[i]+"px\" visibility=\"hidden\" z-index='1000' onMouseOut=\"hideAll();\" onMouseOver=\"stopTime();\">";
        else layer += "<div id=\"Layer"+i+"\" style=\"position:absolute; left:"+left+"px; top:"+top+"px; width:"+taillesDiv[i]+"px; z-index:10000; visibility: hidden;\" onMouseOut=\"hideAll();\" onMouseOver=\"stopTime();\">";
        // Affichage des infos
        layer += "<table bgcolor=\""+couleurMenu+"\" width=\""+taillesDiv[i]+"px\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">";
        for (j=1; j<liens[i].length;j++){
            if(document.layers){ //NS
                layer += "<tr><td valign=\"top\" bgcolor=\""+couleurMenu+"\" class='on'><img src='../images/menu/arrowMenu.gif' border='0' ></td><td bgcolor=\""+couleurMenu+"\" align=\"left\" width=\"100%\" ><a class=\"DE_Menue_Top\" href=\""+liens[i][j]+"\" onMouseOver=\"show('Layer"+i+"');\">"+libelles[i][j]+"<br></a></td></tr>";
            }else{ // IE
                layer += "<tr><td valign=\"top\" style=\"padding-top : 1px;\" bgcolor=\""+couleurMenu+"\" class='on'><img src='../images/menu/arrowMenu.gif' border='0' ></td><td bgcolor=\""+couleurMenu+"\" align=\"left\" width=\"100%\" onMouseOver=\"show('Layer"+i+"');\"><a class=\"DE_Menue_Top\" href=\""+liens[i][j]+"\">"+libelles[i][j]+"<br></a></td></tr>";
            }
        }
        layer += "<tr><td valign=\"top\" style=\"padding-top : 1px;\" bgcolor=\""+couleurMenu+"\" class='on'><img src='../images/1x1_transparent.gif' border='0' width='1' height='5'></td><td bgcolor=\""+couleurMenu+"\" align=\"left\" width=\"100%\"><img src='../images/1x1_transparent.gif' border='0' width='1' height='1'></td></tr>";
        layer += "</table>";
        if (document.layers) layer +="</layer>";
        else layer += "</div>";
        leftAll += tailles[i];// On incremente le decalage de la largeur du layer
    }
    // Bug NS
    if(document.layers){
        layer += "<layer name=\"Layer"+0+"\" top=\""+top+"px\" left=\""+leftL+"px\" width=\""+taillesDiv[0]+"px\" visibility=\"hidden\" z-index='1000' onMouseOut=\"hideAll();\" onMouseOver=\"stopTime();\">";
        layer += "<table bgcolor=\""+couleurMenu+"\" width=\""+taillesDiv[0]+"px\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">";
        for (j=1; j<liens[0].length;j++){
            layer += "<tr><td valign=\"top\" bgcolor=\""+couleurMenu+"\" class='on'><img src='../images/menu/arrowMenu.gif' border='0' ></td><td bgcolor=\""+couleurMenu+"\" align=\"left\" width=\"100%\" ><a class=\"DE_Menue_Top\" href=\""+liens[0][j]+"\" onMouseOver=\"show('Layer"+0+"');\">"+libelles[0][j]+"<br></a></td></tr>";
        }
        layer += "<tr><td valign=\"top\" style=\"padding-top : 1px;\" bgcolor=\""+couleurMenu+"\" class='on'><img src='../images/1x1_transparent.gif' border='0' width='1' height='5'></td><td bgcolor=\""+couleurMenu+"\" align=\"left\" width=\"100%\"><img src='../images/1x1_transparent.gif' border='0' width='1' height='1'></td></tr>";
        layer += "</table>";
        if (document.layers) layer +="</layer>";
    }
    return(layer);
}

<!-- fonction d'initialisation de l'offset -->
function initOffsets(){
    if (document.layers){// NS 4 et <
        if (os() == "win")offsetVer = 14;
        else offsetVer = 6;
        if (!centre){
            if (os() == "win")offsetHor = 8 + leftMenu;
            else offsetHor = 8 + leftMenu;
        }else{
            // Calcul du centre de la fenetre
            page_width = innerWidth;
            if (largeur>page_width){
                offsetHor = 8 + leftMenuNotCenter;
            }else{
                milieu_width = (page_width/2);
                offsetHor = (milieu_width - largeur/2 - 8) + leftMenu;
            }
        }
    }else if (document.all){// IE
        if (os() == "win")offsetVer = 15;
        else offsetVer = 8;
        if (!centre){
            if (os() == "win")offsetHor = 10 + leftMenu;
            else offsetHor = 8 + leftMenu;
        }else{
            // Calcul du centre de la fenetre
            page_width = document.body.clientWidth;
            if (largeur>page_width){
                if (os() == "win")offsetHor = 10 +leftMenuNotCenter;
                else offsetHor = 8 + leftMenuNotCenter;
            }else{
                milieu_width = (page_width/2);
                offsetHor = milieu_width - largeur/2 + leftMenu;
            }
        }
        if(navigator.appVersion.toLowerCase().indexOf('msie 5.0')!=-1){
            offsetHor -= 8;
        }
    }else if (document.getElementById){
        offsetVer = 10;
        if (!centre){
            offsetHor = 8;
        }else{
            // Calcul du centre de la fenetre
            page_width = innerWidth;
            if (largeur>page_width){
                offsetHor = 10 + leftMenuNotCenter;
            }else{
                milieu_width = (page_width/2);
                offsetHor = milieu_width - largeur/2 + leftMenu;
            }
        }
    }
    // A la fin on ajoute les left des menus
    if (largeur>page_width){
        offsetHor += leftMenuNotCenter;
    }else{
        offsetHor += leftMenu;
    }
}
function initPosition(){
    initOffsets();
    //largLayer = Math.round(largeur/liens.length);
    largeurAll = 0;
    for (i=0;i<liens.length; i++){
        id = 'Layer'+i;
        left = (largeurAll)+offsetHor;
        if (document.layers){// NS 4 et <
            document[id].left = left;
        }
        if (document.all){// IE
            document.all[id].style.left = left;
        }
        if (document.getElementById){
            document.getElementById(id).style.left = left;
        }
        largeurAll += tailles[i];
    }
}
<!-- Fonction d'affichage d'un layer -->
function show(id, numero){
    openMenu = true;
    if (document.layers){// NS 4 et <
        document[id].visibility = 'show';
    }
    if (document.all){// IE
        document.all[id].style.visibility = 'visible';
    }
    if (document.getElementById){
        document.getElementById(id).style.visibility = 'visible';
    }
    if(typeof numero != "undefined"){
        stopTime();
        hideAll(numero);
    }
}

<!-- Fonction de cachage de layer -->
function hide(id){
    openMenu = false;
    if (document.layers){// NS 4 et <
        document[id].visibility = 'hidden';
    }
    if (document.all){// IE
        document.all[id].style.visibility = 'hidden';
    }
    if (document.getElementById){
        document.getElementById(id).style.visibility = 'hidden';
    }

}

function doHide(){
    if(openMenu){
        timeId = setTimeout("hideAll()",200);
    }
}
function stopTime(){
    clearTimeout(timeId);
}

function hideAll(numero){
    time = 0;
    for (i=0;i<liens.length; i++){
        if(typeof numero=="undefined"){
            id = 'Layer'+i;
            hide(id);
        }else{
            if(i!=numero){
                id = 'Layer'+i;
                hide(id);
            }
        }
    }
}


<!-- Fonction ecrire -->
function ecrire(valeur){
    if (document.all){
        //document.body.innerHTML = valeur;
        document.write(valeur);
    }else if (document.getElementById){
        document.write(valeur);
    }else if (document.layers){
        //document.open();
        document.write(valeur);
    //document.close();
    }
}

<!-- Fonction de recherche de l'os -->
function os(){
    if (navigator.platform.toLowerCase().indexOf("win") != -1){
        return "win";
    }else if (navigator.platform.toLowerCase().indexOf("Mac") != -1){
        return "mac";
    }
}
