Conflit JS

Fermé
flox - 13 nov. 2008 à 16:13
 flox - 13 nov. 2008 à 22:04
Bonjour,
j'ai 2 menus deroulants sur une meme page et les tailles des attributs portent le meme nom, le resultat n'est donc pas tout a fait ce que j'attends. Y a t'il un moyen de "verouiller" chaque menu?
Merci par avance!!!

<SCRIPT LANGUAGE="JavaScript">


var taille = 800;
var taille2 = 15;

var couleur_fond = "#7D8BA1";
var couleur_rollover = "#BEC6CE";
var couleur_texte = "#FFFFFF";
var couleur_texte_over = "#000000"; //couleur du texte lors du passage de la souris

var taille_texte = 3;
var police_texte = "Verdana";

var target = true;
var frame = "";
var nbelem = 4;

var titre = new Array(nbelem); //ne pas modifier
var liens = new Array(nbelem); //ne pas modifier

titre[0] = "Photo du SHOP";
liens[0] = "shop.html";
titre[1] = "Photo du TEAM";
liens[1] = "team.html";
titre[2] = "Acceder au shop";
liens[2] = "plan mappy.html";
titre[3] = "Nous contacter";
liens[3] = "";


function aff_menu(){
var taille_cellule = taille / nbelem;
cible = (!target)? "_blank":frame;

document.write("<table height=\""+taille2+"\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\" width=\""+taille+"\" bgcolor=\""+couleur_fond+"\" style=\"border-color:#000000; border-width: 1px; border-style: solid\"><tr>");

for(i=0;i<nbelem;i++){
document.write("<td align=\"center\" width=\""+taille_cellule+"\" onmouseover=\"mOvr(this,'"+couleur_rollover+"');\" onmouseout=\"mOut(this,'"+couleur_fond+"');\" bgcolor=\""+couleur_fond+"\"><a style=\"color: "+couleur_texte+"; text-decoration: none\" href=\""+liens[i]+"\" target=\""+cible+"\"><font face=\""+police_texte+"\" size=\""+taille_texte+"\">"+titre[i]+"</font></a></td>");
}

document.write("</tr></table>");
}

function mOvr(src,clrOver){
if (!src.contains(event.fromElement)) {
src.style.cursor = 'hand';
src.bgColor = clrOver;
src.children.tags('A')[0].style.color = couleur_texte_over;
}
}

function mOut(src,clrIn) {
if (!src.contains(event.toElement)) {
src.style.cursor = 'default';
src.bgColor = clrIn;
src.children.tags('A')[0].style.color = couleur_texte;
}
}

</script>










<SCRIPT LANGUAGE="JavaScript">


var largeur = 120;//Largeur du menu
var gauche = 50;//nombre de pixe de la gauche de l'écran
var top = 100;//Nombre de pixels du haut de la page
var couleur_police_cat="#FFFFFF";//Couleur du texte des categories
var couleur_police_scat="#000000";//Couleur du texte des sous-categories
var couleur_cat="#959EAD";//Couleur de fond des categories
var couleur_scat="#C3C9D4";//Couleur de fond des sous-categories


var taille = 11;
var police = "Arial";

var nb_elem = 4;

var nb_souscat = new Array(nb_elem);

nb_souscat[0] = 3;//Nombre de sous categorie 1
nb_souscat[1] = 3;//Nombre de sous categorie 2
nb_souscat[2] = 2;//Nombre de sous categorie 3
nb_souscat[3] = 3;//Nombre de sous categorie 4

var categorie = new Array(nb_elem);
var soustab = new Array;

var tab0 = new Array(nb_souscat[0]);
var tab1 = new Array(nb_souscat[1]);
var tab2 = new Array(nb_souscat[2]);
var tab3 = new Array(nb_souscat[3]);
//répeter aussi souvent qu'il y a de categorie...


categorie[0] = "KITESURF";

tab0[0] = " Script|http://www.script-masters.com|_blank";
tab0[1] = " Tutoriaux|http://www.script-masters.com|_blank";
tab0[2] = " Liens|http://www.script-masters.com|_blank";

categorie[1] = " Php";//Titre de la categorie

tab1[0] = " Liens|http://www.script-masters.com|_blank";
tab1[1] = " Forums|http://www.script-masters.com|_blank";
tab1[2] = " Livres|http://www.script-masters.com|_blank";

categorie[2] = " MySql";

tab2[0] = " Bases|http://www.script-masters.com|_blank";
tab2[1] = " Livres|http://www.script-masters.com|_blank";

categorie[3] = " Forum"; //Titre de la categorie

tab3[0] = " Javascript|http://www.script-masters.com|_blank";
tab3[1] = " Php/MySQL|http://www.script-masters.com|_blank";
tab3[2] = " Webmasters|http://www.script-masters.com|_blank";


soustab[0] = tab0;
soustab[1] = tab1;
soustab[2] = tab2;
soustab[3] = tab3;

var conf = -1;
function Init(){
var hauteur = top;
for(i=1;i<=nb_elem;i++){
document.getElementById("menu"+i+"").style.top = hauteur;
hauteur = hauteur + 17;
}
}

function voir(z){
if(conf==z){
document.getElementById("sousmenu"+z+"").style.visibility = 'hidden';
Init();
conf=conf+nb_elem;
}else{
conf=z;

haut=0;
var haut = 15*nb_souscat[z-1]+z*18+top;


for(i=1;i<=nb_elem;i++){
document.getElementById("sousmenu"+i+"").style.visibility = 'hidden';
}

Init();

document.getElementById("sousmenu"+z+"").style.top = 16;
dec = haut;

for(i=z+1;i<=nb_elem;i++){

document.getElementById("menu"+i+"").style.top = dec;
dec=dec+18;}

document.getElementById("sousmenu"+z+"").style.height = 15*nb_souscat[z-1];
document.getElementById("sousmenu"+z+"").style.visibility = 'visible';}}

function affiche(){

document.write('<style>');
document.write('div.menu{visibility:visible; border-width: 1px; border-style: solid; border-color: #000000;background-color: '+couleur_cat+'}');
document.write('div.sousmenu{position:absolute; left:-1; height:20; visibility:hidden; width:'+ largeur +'; border-width: 1px; border-style: solid; border-color: #000000;background-color: '+couleur_scat+'}');
document.write('a.menu{font-family: '+ police +'; color: '+couleur_police_cat+'; font-size: '+taille+'px; font-weight:bold; text-decoration: none;}');
document.write('a.smenu{font-family: '+ police +'; color: '+couleur_police_scat+'; font-size: '+taille+'px; font-weight:bold; text-decoration: none;}');
document.write('</style>');
document.write('<div>');

for(i=0;i<nb_elem;i++){
boucle = nb_souscat[i];


document.write('<div id="menu'+(i+1)+'" style="position:absolute; left:'+ gauche +'px; width:'+ largeur +'px;" class="menu">');
document.write('<a href="#" class="menu" onClick="javascript:voir('+(i+1)+')">'+categorie[i]+'</a>');

document.write('<div width="'+ largeur +'" id="sousmenu'+(i+1)+'" class="sousmenu">');


for(z=0;z<boucle;z++){
elem=soustab[i][z].split("|");
document.write('<div height="15"><a href="'+elem[1]+'" target="'+elem[2]+'" class="smenu">'+elem[0]+'</a></div>'); }
document.write('</div>');
document.write('</div>');}
document.write('</div>');
document.onLoad=Init();
}
</script>





<tr>
<td rowspan="2">
<div style="opacity: 1; height: 57px; left: 0px; position: absolute; top: 100px; width: 800px; z-index: 1; " class="graphic_textbox_style_default" id="id4">
<script language="Javascript">
affiche();
</script>
</DIV></td>
<td height="1"></td>
</tr>




//entre les balises body
<tr>
<td rowspan="2">
<div style="opacity: 1; height: 57px; left: 220px; position: absolute; top: 570px; width: 800px; z-index: 1; " class="graphic_textbox_style_default" id="id4">
<script>
aff_menu()
</script>
</DIV></td>
<td height="1"></td>
</tr>

2 réponses

heu.. désolé, ma presentation est un peu sparciate mais je suis dessus depuis plusieurs jours (enfin... nuit)
Et je ne parle plus, je ne mange plus, je ne dors plus.....
PLEASE HELLLLPPP MMMEEEEEEE!
0
personne pour m'aider?
C'est 2 p'tit menus JS.... siouplait!
Merci d'avance
0