
No puedo poner 2 menúes dinámicos en una misma pág
Publicado por HugoSS (2 intervenciones) el 14/10/2010 18:09:31
Hola! como estan?
Estoy con un gran problema, que me está rompiendo la cabeza! :(
Resulta que en mi sitio agregué 2 menúes dinámicos.
Estos menúes estan hechos con JavaScript, ambos se dibujan usando UL y LI.
Ambos manejan estilos CSS y con herencia. O sea que los estilos de los UL y LI siempre estan declarados dentro del contexto de sus contenedores, de la forma
#menu_vertical ul{ ...}
#menu_vertical li{ ...}
#menu_horizontal ul{ ...}
#menu_horizontal li{ ...}
Las funciones JS de cada menú son diferentes e independientes. Sucede que adapté 2 menúes libres que encontré en internet, o sea que los autores seguro ni se conocen! jaja
El problema está cuando quiero hacer que ambos levante en el sitio y comiencen a andar.
El menú Horizontal inicia empleando:
window.onload = initHorizontalMenu;
que está declarado al final del archivo JS.
El menú Vertical inicia empleando.
<body onload="menuVertical_init(0,12,1,-20,10)">
declarado en el body de la página.
Será que el problema es que ambos usan algo interno del navegador al mismo tiempo y eso no permite que se ejecuten ambos menúes? Porque cuando quito la linea que inicia del menú horizontal, el menú vertical anda bien. Y cuando quito la linea que inicia el menú vertical el menú horizontal anda bien. Pero cuando declaro ambos siempre anda solamente el vertical.
Aqui pego el código de ambas funciones que inician cada menú. Despué hay más funciones pero a lo mejor esto ayude para entender que esta pasando. Espero me pueda ayudar alguien porque ya estoy desesperado! :( GRACIAS!!!
function menuVertical_init(){
var i,g,tD,tA,tU,pp,lvl,tn=navigator.userAgent.toLowerCase();
if(window.opera){
if(tn.indexOf("opera 5")>-1||tn.indexOf("opera 6")>-1){return;}
}
else if(!document.getElementById){return;}
menup=arguments;
menuct=new Array;
tD=document.getElementById('menuvert');
if(tD){
tA=tD.getElementsByTagName('A');
for(i=0;i<tA.length;i++){
tA[i].menucl=menuct.length;menuct[menuct.length]=tA[i];g=tA[i].parentNode.getElementsByTagName("UL");
tA[i].menusub=(g)?g[0]:false;ev=tA[i].getAttribute("onmouseover");
if(!ev||ev=='undefined'){
tA[i].onmouseover=function(){
menu_trig(this);
};
}
ev=tA[i].getAttribute("onfocus");
if(!ev||ev=='undefined'){
tA[i].onfocus=function(){menu_trig(this);}
;}
if(tA[i].menusub){
pp=tA[i].parentNode;
lvl=0;
while(pp){
if(pp.tagName&&pp.tagName=="UL"){lvl++;}pp=pp.parentNode;
}
tA[i].menulv=lvl;
}
}
tD.onmouseout=menu_close;
menu_open();
}
}
function initHorizontalMenu(){
dhtmlgoodies_menuObj = document.getElementById('dhtmlgoodies_menu');
var aTags = dhtmlgoodies_menuObj.getElementsByTagName('A');
for(var no=0;no<aTags.length;no++){
var subUl = aTags[no].parentNode.getElementsByTagName('UL');
if(subUl.length>0 && aTags[no].parentNode.parentNode.parentNode.id != 'dhtmlgoodies_menu'){
/*var img = document.createElement('IMG');
img.src = dhtmlgoodies_menu_arrow;
aTags[no].appendChild(img);
*/
var lbl = document.createElement('LABEL');
lbl.innerHTML = " >";
aTags[no].appendChild(lbl);
}
}
var mainMenu = dhtmlgoodies_menuObj.getElementsByTagName('UL')[0];
mainMenu.className='menuBlock1';
mainMenu.style.zIndex = currentZIndex;
mainMenu.setAttribute('currentDepth' ,1);
mainMenu.currentDepth = '1';
mainMenu.onmouseover = mouseOverMenu;
mainMenu.onmouseout = mouseOutMenu;
var mainMenuItemsArray = new Array();
var mainMenuItem = mainMenu.getElementsByTagName('LI')[0];
mainMenu.style.height = mainMenuItem.offsetHeight + 2 + 'px';
while(mainMenuItem){
mainMenuItem.className='currentDepth1';
mainMenuItem.id = 'dhtmlgoodies_listItem' + liIndex;
mainMenuItem.onmouseover = showHideSub;
liIndex++;
if(mainMenuItem.tagName=='LI'){
mainMenuItem.style.cssText = 'float:left;';
mainMenuItem.style.styleFloat = 'left';
mainMenuItemsArray[mainMenuItemsArray.length] = mainMenuItem;
initSubMenus(mainMenuItem,0,2);
}
mainMenuItem = mainMenuItem.nextSibling;
}
for(var no=0;no<mainMenuItemsArray.length;no++){
initSubMenus(mainMenuItemsArray[no],0,2);
}
menuParentOffsetLeft = getLeftPos(dhtmlgoodies_menuObj);
window.onresize = resizeMenu;
dhtmlgoodies_menuObj.style.visibility = 'visible';
}
Estoy con un gran problema, que me está rompiendo la cabeza! :(
Resulta que en mi sitio agregué 2 menúes dinámicos.
Estos menúes estan hechos con JavaScript, ambos se dibujan usando UL y LI.
Ambos manejan estilos CSS y con herencia. O sea que los estilos de los UL y LI siempre estan declarados dentro del contexto de sus contenedores, de la forma
#menu_vertical ul{ ...}
#menu_vertical li{ ...}
#menu_horizontal ul{ ...}
#menu_horizontal li{ ...}
Las funciones JS de cada menú son diferentes e independientes. Sucede que adapté 2 menúes libres que encontré en internet, o sea que los autores seguro ni se conocen! jaja
El problema está cuando quiero hacer que ambos levante en el sitio y comiencen a andar.
El menú Horizontal inicia empleando:
window.onload = initHorizontalMenu;
que está declarado al final del archivo JS.
El menú Vertical inicia empleando.
<body onload="menuVertical_init(0,12,1,-20,10)">
declarado en el body de la página.
Será que el problema es que ambos usan algo interno del navegador al mismo tiempo y eso no permite que se ejecuten ambos menúes? Porque cuando quito la linea que inicia del menú horizontal, el menú vertical anda bien. Y cuando quito la linea que inicia el menú vertical el menú horizontal anda bien. Pero cuando declaro ambos siempre anda solamente el vertical.
Aqui pego el código de ambas funciones que inician cada menú. Despué hay más funciones pero a lo mejor esto ayude para entender que esta pasando. Espero me pueda ayudar alguien porque ya estoy desesperado! :( GRACIAS!!!
function menuVertical_init(){
var i,g,tD,tA,tU,pp,lvl,tn=navigator.userAgent.toLowerCase();
if(window.opera){
if(tn.indexOf("opera 5")>-1||tn.indexOf("opera 6")>-1){return;}
}
else if(!document.getElementById){return;}
menup=arguments;
menuct=new Array;
tD=document.getElementById('menuvert');
if(tD){
tA=tD.getElementsByTagName('A');
for(i=0;i<tA.length;i++){
tA[i].menucl=menuct.length;menuct[menuct.length]=tA[i];g=tA[i].parentNode.getElementsByTagName("UL");
tA[i].menusub=(g)?g[0]:false;ev=tA[i].getAttribute("onmouseover");
if(!ev||ev=='undefined'){
tA[i].onmouseover=function(){
menu_trig(this);
};
}
ev=tA[i].getAttribute("onfocus");
if(!ev||ev=='undefined'){
tA[i].onfocus=function(){menu_trig(this);}
;}
if(tA[i].menusub){
pp=tA[i].parentNode;
lvl=0;
while(pp){
if(pp.tagName&&pp.tagName=="UL"){lvl++;}pp=pp.parentNode;
}
tA[i].menulv=lvl;
}
}
tD.onmouseout=menu_close;
menu_open();
}
}
function initHorizontalMenu(){
dhtmlgoodies_menuObj = document.getElementById('dhtmlgoodies_menu');
var aTags = dhtmlgoodies_menuObj.getElementsByTagName('A');
for(var no=0;no<aTags.length;no++){
var subUl = aTags[no].parentNode.getElementsByTagName('UL');
if(subUl.length>0 && aTags[no].parentNode.parentNode.parentNode.id != 'dhtmlgoodies_menu'){
/*var img = document.createElement('IMG');
img.src = dhtmlgoodies_menu_arrow;
aTags[no].appendChild(img);
*/
var lbl = document.createElement('LABEL');
lbl.innerHTML = " >";
aTags[no].appendChild(lbl);
}
}
var mainMenu = dhtmlgoodies_menuObj.getElementsByTagName('UL')[0];
mainMenu.className='menuBlock1';
mainMenu.style.zIndex = currentZIndex;
mainMenu.setAttribute('currentDepth' ,1);
mainMenu.currentDepth = '1';
mainMenu.onmouseover = mouseOverMenu;
mainMenu.onmouseout = mouseOutMenu;
var mainMenuItemsArray = new Array();
var mainMenuItem = mainMenu.getElementsByTagName('LI')[0];
mainMenu.style.height = mainMenuItem.offsetHeight + 2 + 'px';
while(mainMenuItem){
mainMenuItem.className='currentDepth1';
mainMenuItem.id = 'dhtmlgoodies_listItem' + liIndex;
mainMenuItem.onmouseover = showHideSub;
liIndex++;
if(mainMenuItem.tagName=='LI'){
mainMenuItem.style.cssText = 'float:left;';
mainMenuItem.style.styleFloat = 'left';
mainMenuItemsArray[mainMenuItemsArray.length] = mainMenuItem;
initSubMenus(mainMenuItem,0,2);
}
mainMenuItem = mainMenuItem.nextSibling;
}
for(var no=0;no<mainMenuItemsArray.length;no++){
initSubMenus(mainMenuItemsArray[no],0,2);
}
menuParentOffsetLeft = getLeftPos(dhtmlgoodies_menuObj);
window.onresize = resizeMenu;
dhtmlgoodies_menuObj.style.visibility = 'visible';
}
Valora esta pregunta


0