molily: Navigation

Beitrag lesen

Hallo,

Mache ich das über booleans? (Habe diese bereits angelegt, einige haben einen false-wert als default, da sie bei öffnen der seite zunächst ausgeblendet sein sollten)

Die Boolean-Variablen brauchst du eigentlich nicht, da du über die Klassen menu_unselected/menu_selected bereits herausfindest, ob der Menüpunkt angeschaltet ist.

Davon abgesehen funktioniert das Setzen der Booleans nicht so, wie du dir das vorstellst. Du übergibst einen String mit dem Variablennamen und schreibst dann einen Boolean-Wert in die lokale Funktionsvariable. Das ändert am Wert der globalen Boolean-Variable nichts. Dazu müsstest du window[boolean] = true/false schreiben, aber wie gesagt sollte das nicht nötig sein.

typo = new Boolean (true);

»new Boolean« ist hier unnötig (der Unterschied ist klein, aber fein), man könnte auch einfach typo = true schreiben.

Für das Ein- und Ausblenden der zugehörigen Elemente kannst du
document.getElementsByClassName
verwenden. Dazu müssen die Elemente die übergebene Klasse besitzen, z.B. class="typo".

Diese Funktion gibt eine Liste mit Elementen zurück, die man mit einer for-Schleife durchlaufen kann und jedes Element ein- oder ausblenden kann.

function swap(imgId, pId, elementClass) {var displayValue = p.className == "menu_selected" ? 'block' : 'none';  
  var elements = document.getElementsByClassName(elementClass);  
  // Durchlaufe Liste  
  for (var i = 0, l = elements.length; i < l; i++) {  
    elements[i].style.display = displayValue;  
  }  
}

Aufruf weiterhin mit: swap('imgTypo', 'pTypo', 'typo');

Eine Alternativlösung wäre, die Ein- und Ausblendlogik im CSS zu notieren, sodass du nur eine Klasse beim body-Element ändern hinzufügen oder löschen musst und dann automatisch alle Nachfahrenelemente mit der jeweiligen Klasse gezeigt bzw. versteckt werden.

Mathias