i intend to creta a dynamic menu with div tag.
the problem is: i create the menu thanks a for loop. that causes an error concerning mouse events.
here is a aprt of my code:
<div class="artiste" onmouseover="showmenu(idee[0])" onmouseout="hidemenu(idee[0])" >
Peintres
<div id="lespeintres" class="menu" style="background-color:lightblue;font:bold;visibility:hidden;position:absolute;left:100;width:100;">
<script language= "javascript">
<!--
for(i=0;i<nom.length;i++)
{
numero_id = idee[i+1];
document.write('<div class="menu" onmouseover="showmenu(numero_id)" onmouseout="hidemenu(numero_id)">' + nom[0] );
//alert(nom[0]);
if (nom[1]=="1")
{
if(nom[3]=="menu1")
{
//alert(nom[1]);
//alert(nom[3]);
document.write('<div id="gauguinet" class="menugauguin" style="background-color:teal;font:bold;visibility:hidden;position:absolute;left:100;width:100;">');
for(j=0;j<nom[2]+1;j++)
{
//alert(menu1[j]);
document.write('<div class="menubis">' + menu1[j] + '</div>');
}
document.write('</div>');
}
if(nom[3]=="menu2")
{
//alert(nom[1]);
//alert(nom[3]);
document.write('<div id="picasset" class="menupicasso" style="background-color:teal;font:bold;visibility:hidden;position:absolute;left:100;width:100;">');
for(j=0;j<nom[2]+1;j++)
{
//alert(menu2[j]);
document.write('<div class="menubis">' + menu2[j] + '</div>');
}
document.write('</div>');
}
if(nom[3]=="menu3")
{
//alert(nom[1]);
//alert(nom[3]);
document.write('<div id="matisset" class="menumatisse" style="background-color:teal;font:bold;visibility:hidden;position:absolute;left:100;width:100;">');
for(j=0;j<nom[2]+1;j++)
{
//alert(menu3[j]);
document.write('<div class="menubis">' + menu3[j] + '</div>');
}
document.write('</div>');
}
}
document.write('</div>');
}
and here are my functions and tables:
nom = new Array(new Array("Gauguin",1,3,"menu1"),new Array("Picasso",1,2,"menu2"),new Array("Monet",0,0,"rien"),new Array("Matisse",1,2,"menu3")); //nom_menu,sousmenu?,nb_sousmenu,nomsousmenu
menu1 = new Array("Biographie","Oeuvres","Contemporains","Ses femmes");
menu2 = new Array("Biographie","Oeuvres","Ses ecrits");
menu3 = new Array("Bio","Influences","Tableaux");
idee = new Array("lespeintres","gauguinet","picasset","monett","matisset");
function showmenu(no_id){
//if(no_id!="lespeintres")
//alert(no_id)
if(document.getElementById(no_id).style.visibility=="hidden")
document.getElementById(no_id).style.visibility="visible";
}
function hidemenu(no_id){
if(document.getElementById(no_id).style.visibility=="visible")
document.getElementById(no_id).style.visibility="hidden";
}
it displays the menu "lespeintres" ("gauguin","picasso","monet","matisse") but while the mouse is over picasso area or gauguin area it displays matisse's menu each time, as if in the for loop i kept the "3" value.
please help me!
the problem is: i create the menu thanks a for loop. that causes an error concerning mouse events.
here is a aprt of my code:
<div class="artiste" onmouseover="showmenu(idee[0])" onmouseout="hidemenu(idee[0])" >
Peintres
<div id="lespeintres" class="menu" style="background-color:lightblue;font:bold;visibility:hidden;position:absolute;left:100;width:100;">
<script language= "javascript">
<!--
for(i=0;i<nom.length;i++)
{
numero_id = idee[i+1];
document.write('<div class="menu" onmouseover="showmenu(numero_id)" onmouseout="hidemenu(numero_id)">' + nom[0] );
//alert(nom[0]);
if (nom[1]=="1")
{
if(nom[3]=="menu1")
{
//alert(nom[1]);
//alert(nom[3]);
document.write('<div id="gauguinet" class="menugauguin" style="background-color:teal;font:bold;visibility:hidden;position:absolute;left:100;width:100;">');
for(j=0;j<nom[2]+1;j++)
{
//alert(menu1[j]);
document.write('<div class="menubis">' + menu1[j] + '</div>');
}
document.write('</div>');
}
if(nom[3]=="menu2")
{
//alert(nom[1]);
//alert(nom[3]);
document.write('<div id="picasset" class="menupicasso" style="background-color:teal;font:bold;visibility:hidden;position:absolute;left:100;width:100;">');
for(j=0;j<nom[2]+1;j++)
{
//alert(menu2[j]);
document.write('<div class="menubis">' + menu2[j] + '</div>');
}
document.write('</div>');
}
if(nom[3]=="menu3")
{
//alert(nom[1]);
//alert(nom[3]);
document.write('<div id="matisset" class="menumatisse" style="background-color:teal;font:bold;visibility:hidden;position:absolute;left:100;width:100;">');
for(j=0;j<nom[2]+1;j++)
{
//alert(menu3[j]);
document.write('<div class="menubis">' + menu3[j] + '</div>');
}
document.write('</div>');
}
}
document.write('</div>');
}
and here are my functions and tables:
nom = new Array(new Array("Gauguin",1,3,"menu1"),new Array("Picasso",1,2,"menu2"),new Array("Monet",0,0,"rien"),new Array("Matisse",1,2,"menu3")); //nom_menu,sousmenu?,nb_sousmenu,nomsousmenu
menu1 = new Array("Biographie","Oeuvres","Contemporains","Ses femmes");
menu2 = new Array("Biographie","Oeuvres","Ses ecrits");
menu3 = new Array("Bio","Influences","Tableaux");
idee = new Array("lespeintres","gauguinet","picasset","monett","matisset");
function showmenu(no_id){
//if(no_id!="lespeintres")
//alert(no_id)
if(document.getElementById(no_id).style.visibility=="hidden")
document.getElementById(no_id).style.visibility="visible";
}
function hidemenu(no_id){
if(document.getElementById(no_id).style.visibility=="visible")
document.getElementById(no_id).style.visibility="hidden";
}
it displays the menu "lespeintres" ("gauguin","picasso","monet","matisse") but while the mouse is over picasso area or gauguin area it displays matisse's menu each time, as if in the for loop i kept the "3" value.
please help me!