✔ Toggle Script

[CrushLog]

Hi,

jeder kennt diese Toggle Scripts. Ich hab eines, was ich gerne für meine Navigation verwenden würde, nur stört mich dabei eine Sache. Wenn ich über einen Menupunkt fahre wird eine zweite Navigation daneben ausgefahren, alles auch gut und schön, aber wie kann ich dem Script beibringen, dass es, sobald man das Script aktiviert, alle anderen <span> tags wieder auf hidden setzt, die nicht diese id haben?

function ToggleMenu (id) {
  if (document.getElementById("Navi_" + id).style.display == 'none') {
    document.getElementById("Navi_" + id).style.display = "block";
 }
  else {
    document.getElementById("Navi_" + id).style.display = "none";
  }
}

Ich fahr mit der Mouse über die Mavigation mit der id 1 und vorher war schon die Navigation mit der id 2 geöffnet. Ich möchte nun, dass er alle anderen span tags auf none setzt, die nicht id 1 haben, kann mir da jemand helfen? Wäre dankbar, da ich mich nicht so gut mit JS auskenn!

 

[Sven Mintel]

Mit

document.getElementsByTagName('span')

hast du Zugriff auf einen Array, in welchem alle span-Elemente des Dokumentes gespeichert sind.
Diesen gehe durch, und schau nach, ob die ID eines Elementes mit "Navi_" beginnt (match(/^Navi_/))... wenn ja, verstecke den span(wenn es nicht der angeklickte ist.)

 

[CrushLog]

Genau so, nur weiss ich nicht, wie man das macht...genau dieses "wenn es nicht der angeklickte ist" würde ich evtl in php lösen können, aber nicht in JS...
könntest du mir da etwas mehr Unterstützung geben?

 

[Sven Mintel]

<script type="text/javascript">
<!--

arrItems=new Array();
function ToggleMenu (id) 
{
    if(arrItems.length==0)
        {
        for(j=0;j<document.getElementsByTagName('span').length;++j)
            {
            if(document.getElementsByTagName('span')[j].id.match(/^Navi_/))
                {   
                    arrItems.push(document.getElementsByTagName('span')[j]);
                }
            }
        }
    
    for(j=0;j<arrItems.length;++j)
        {
        (arrItems[j]!=document.getElementById('Navi_'+id))
                        ?arrItems[j].style.display='none'
                        :'';
        }
document.getElementById('Navi_'+id).style.display=
        (document.getElementById('Navi_'+id).style.display!='block')
            ?'block'
            :'none';
}
//-->
</script>

....Beim ersten Aufruf des Skriptes werden alle <span>'s , deren ID mit "Navi_" beginnt, in einem Array gespeichert.

Den kann man dann bequem durchlaufen, und jenachdem verstecken, anzeigen.

 

[CrushLog]

Ok, dank dir, werd mich damit morgen befassen und versuchen das mal zu testen :]