Zum Inhalt springen

Navigation: CSS-Klasse übergeordnetem HTML-Tag zuweisen

Erstellt am 30. Oktober 2007 · 4 Antworten · letzte Antwort am 31. Oktober 2007

Tags: HTML & CSS, Frage

flashGordon ·

Hallo,

ich habe noch keine Erfahrung mit TS und frage mich, ob ich auch übergeordneten HTML-Tags ausgewählter Navigationspunkte neue CSS-Klassen zuweisen kann. Im folgenden Beispiel habe ich die Klasse marked dem a-Tag zugewiesen [HTML, Z. 5]. Eigentlich möchte ich die marked Klasse aber dem übergeordneten li-Tag zuweisen. Geht so etwas? Oder wie würde es jemand mit etwas mehr TS Erfahrung lösen?

tmp.HAUPTNAVIGATION = HMENU
tmp.HAUPTNAVIGATION {
	1 = TMENU
	1 {
		wrap = <ul id="navigation"> | </ul>
		NO = 1
		NO.wrapItemAndSub = <li> | </li>
		CUR < .NO 
         	CUR {
         		ATagParams = class="marked"
		}
	}
}
<ul id="navigation">
	<li><a href="index.php?id=7" onfocus="blurLink(this);">Startseite</a></li>
	<li><a href="index.php?id=5" onfocus="blurLink(this);">Zur Person</a></li>
	<li><a href="index.php?id=6" onfocus="blurLink(this);">Training und Seminare</a></li>
	<li><a href="index.php?id=8" onfocus="blurLink(this);" class="marked">Prozessberatung</a></li>
	<li><a href="index.php?id=9" onfocus="blurLink(this);">Großveranstaltungen</a></li>
	<li><a href="index.php?id=10" onfocus="blurLink(this);">Referenzen</a></li>
	<li><a href="index.php?id=11" onfocus="blurLink(this);">Kontakt</a></li>
</ul>
Unbekannter Benutzer ·

und warum schreibst du nicht einfach <li class="marked">|</li>?

Oder einfach im CSS
ul#navigation li { ... }

Oder im CSS
li { Definitionen vom marked }

Da gibts ja nu viele Wege...

flashGordon ·

Ich möchte nur dem li-Tag die Klasse marked zuweisen, dessen Link gerade aktiv ist, nicht allen li-Tags.
Naja, habe jetzt ein bisschen mit margins und paddings gepfuscht und marked auf ein zusätzliches DIV gesetzt. Schade, ich dachte Typo3 kann die Elternelemente auch manipulieren.

linkWrap = <div class="marked"> | </div>
Unbekannter Benutzer ·

OK, dann habe ich dich missverstanden...

Dann empfehle ich dir in die TsRef zu schauen in den Bereich TMENUITEM, dort findest du die verschiedenen Menüzustände... Unter anderem auch ACT und CUR, die du ja auch schon verwendest. Nur fehlt dir ja quasi ein wrap dafür... du kopierst diesen nämlich aus NO (CUR < .NO)

Einfach den entsprechenden Bereich hinzufügen und einen neuen wrap definieren.

also etwa:

CUR < .NO
CUR {
        wrapItemAndSub = <li class="marked"> | </li>
        ATagParams =
}
flashGordon ·

Danke für die Starthilfe!
Hab mir heute erstmal ein schön dickes Buch gekauft. Da gibt es doch noch zu viel, das sich einem nicht auf Anhieb erschließt...