var myMenu = new function menuManager() { /** * initialise les elements du menu */ this.init = function() { // Parcours des éléments de 1er niveau du menu $$('#menuContainer .entry').each(function(item){ // Masque le sous-menu window.myMenu.hide(item); // ajoute les evenements de survol de la souris (afficher/cacher) item.onmouseover = function(){window.myMenu.show(item)}; item.onmouseout = function(){window.myMenu.hide(item)}; // Un problème est détecté sous certains navigateurs (FIXME) : la largeur des éléments du sous-menu n'est pas constante. // Il faut donc parcourir le sous-menu pour fixer manuellement la taille de chaque élément à la taille du plus grand window.myMenu.parseMenu(item, 1); }); } this.parseMenu = function(item, level) { // Récupération d'un éventuel sous-menu au sous-menu courant var submenu = $(item).down('dd'); if( submenu ) { // Le dd est à la taille du plus grand des éléments le contenant. Nous partons donc sur cette taille var width = parseInt( $(submenu).getWidth() ); if( width > 0 ) { // Pour chaque élément du sous-menu, nous fixons la taille, en prennant garde à retirer les éventuels padding (ne pas dépasser la taille maximale) // Le level permet de ne pas sélectionner les sous-sous-menu $(submenu).select('.level_'+level).each(function(subitem){ // ajoute les evenements de survol de la souris (afficher/cacher) subitem.onmouseover = function(){window.myMenu.show(subitem)}; subitem.onmouseout = function(){window.myMenu.hide(subitem)}; var padding = parseInt($(subitem).getStyle('paddingLeft').sub('px', '')); padding += parseInt($(subitem).getStyle('paddingRight').sub('px', '')); newWidth = width - padding; subitem.style.width = newWidth + 'px'; window.myMenu.parseMenu(subitem, level+1); }); } } } /** * affiche le sous menu de l'element survolé */ this.show = function(item) { var submenu = $(item).down('dd'); if( submenu ) $(submenu).show(); } /** * masque le sous menu de l'element survolé */ this.hide = function(item) { var submenu = $(item).down('dd'); if( submenu ) { $(submenu).select('dl').each(function(subitem){ window.myMenu.hide(subitem); }); $(submenu).hide(); } } }