Java Script ?

[Membaris]

Hallo ihr,

ich kenn mich nicht so gut mit Java Script aus , aber es müsste doch möglich sein einem DOM Element eine CSS Klasse hinzuzufügen. Der Grund ist folgender :

Ich habe auf unserer neuen Vereinsseite (in Entwicklung lokal auf Server) 4 Menüpunkte in der Navigation.

Hier gibts jetzt den Menüpunkt "Information" auf der Contao Seite Siet das so aus.

Information
> Artikel Information
|
| - Seite 1
> Artikel Seite 1
|
| - Seite 2
> Artikel Seite 2


Durch CSS ist das alles so geschrieben das wenn Information aktiv ist , sprich die Klasse li.active da ist ein Border gezeichnet wird.
Das selbe möchte ich auch mit Seite 1 und Seite 2 erreichen. Dazu müsste ich ja jetzt den Link in der Navigation mit dem Inhalt Information auf li.active setzen.

Hat hierzu zufällig schon jemand ein Beispiel ? Oder eine Idee wie ich das umsetzen könnte ?

[dazzle89]

Ich versteh dein Anliegen nicht ganz.

Seite 1 und Seite 2 müssten ebenfalls die Klasse .active bekommen wenn man sich dort befindet.

Oder möchtest du die Klasse bei Information haben, wenn man auf Seite 1 oder Seite 2 ist? Für solche Fälle gibt es die Klasse .trail, die automatisch generiert wird.

[Membaris]

Seite 1 und Seite 2 müssten ebenfalls die Klasse .active bekommen wenn man sich dort befindet.

genau das , ich bekomme das aber mit jquery und toggle Class bzw add Class nicht auf die Reihe ...

[dazzle89]

Ich habe doch die .trail Klasse erwähnt. Die müsste der Menüpunkt "Information" bei dir haben, wenn du auf Seite 1 oder 2 bist.

Die ist genau dafür gedacht.

[Membaris]

Hab ich gerade festgestellt .... man man ist einfach zu heiß hier .....

Danke für dein Schups in die richtige Richtung ;-)

[soweit_ok]

Ohne JS-Bibliothek sollte es normalerweise z. B. so gehen:

var addClass = document.getElementByClassName("elementklasse");
addClass.className = addClass.className + " weitereklasse";

Ist aber Quatsch. Zum einen brauchts kein JS, weil man zusätzliche Klassen einfach im Navi-Template mit generieren kann. Zweitens gibts doch die nötige Klasse bereits (trail), siehe Posting #4 von dazzle89. Bei mir brauchte ich für dasselbe allerdings auch die trail-Klasse nicht, weils auf jeder Ebene funktioniert. Auszug aus meinem Layout-Css ....

#right .mod_navigation ul li span, #right .mod_customnav ul li span, #rightbox_1 .mod_navigation ul li span, #rightbox_1 .mod_customnav ul li span {
  background: none repeat scroll 0 0 silver !important;
  color: #fff !important;
  font-weight: normal;
  opacity: 0.99 !important;
}