ACT-Zustand bei Menu

michelt3 · 2. August 2006 13:42

Hallo zusammen,

habe bei folgendem Menu Probleme mit CSS-Definition des ACT-Zustandes. Firefox funktioniert - IE macht es einfach nicht.

Gibt es eine Möglichkeit den ACT-Zustand über TypoSkript zu definieren? Egal was ich auch versuche, der IE zeigt es nicht richtig an.

Ich bin am verzweifeln. Mein erstes T3-Projekt
und ich komm einfach nicht weiter.

Für Eure Hilfe wäre ich sehr dankbar.

Gruß Michael

TOPMENU = COA
TOPMENU {
	10 = TEXT
	10.value =
				
	20 = HMENU
	20 {
		special = list
		special.value = 3,5,6,8,9
				
		1 = TMENU
					
		# 1.NO.stdWrap.wrap = 1.| || 2.| || 3.| || 4.|
		1.NO.linkWrap = |  |  |*||  |  |*||
		1.NO.ATagTitle.field = abstract // description
									
					
		1.ACT < .1.NO
		1.ACT.ATagParams = class="act"
		1.ACT = 1
					

	}
}

Unbekannter Benutzer · 2. August 2006 13:52

Tja, CSS und der IE sind immer so eine Sache, die Frage ist, was genau du vorhast und was nicht klappt.
So wie ich das sehe hast du doch in deinem TS-Code einen ACT Zustand. Schau mal in den Quellcode der Seite im Frontend, hat der aktive A-Tag ein class="act" ? Wenn ja, dann sollte es mit CSS auch klappen. Allerdings würde ich dir empfehlen den NO A-Tags auch eine class zu verpassen, du stylest jetzt wahrscheinlich einmal den puren a Tag und dann die .act. Da könnte dein Problem liegen, denn meiner Erfahrung nach bekommt dann der style vom a Tag den vorrang vor einer Klasse.

Gruß

Christian

michelt3 · 2. August 2006 14:12

Hallo Christian,

ja im Quellcode hat der aktive A-Tag ein class="act".
Das ganze hab ich über div-container angelegt.

Hier mal die CSS, Designvorlage und TypoScript.
Vielleicht kannst Du auch am link was erkennen.
Ich weiß wirkliche nicht mehr weiter:

#nav a{
text-decoration:none;
color:#ffffff;
}

#nav a:visited{
text-decoration:none;
color:#ffffff;
}

#nav a.cur{
text-decoration:none;
color:#ffec00;
}

#nav a.act{
text-decoration:none;
color:#ffec00;
}

#nav a:hover{
text-decoration:none;
color:#ffec00;
}

config {
	locale_all = de_DE
	language = de
	sys_language_uid = 0
	linkVars = L
	uniqueLinkVars = 1	
	spamProtectEmailAddresses = -2
	spamProtectEmailAddresses_atSubst = [at]
	simulateStaticDocuments_noTypeIfNoTitle = 1
}


page = PAGE
page {
	typeNum = 0
	bodyTag = <body>
	includeCSS {
		file1 = fileadmin/templates/screen.css	
		file1.media = screen
		
		file2 = fileadmin/templates/print.css
		file2.media = print
	}	
	config {
		doctype = xhtml_strict
	} 
	10 = TEMPLATE
	10 {
		template = FILE
		template.file = fileadmin/templates/designvorlage.html
		workOnSubpart = DOKUMENT
		marks {
			LINIEN = FILE
			LINIEN.file = fileadmin/images/img_linien.jpg
			
			HEADLINE = FILE
			HEADLINE.file = fileadmin/images/img_headline.jpg
			
			LOGO = FILE
			LOGO.file = fileadmin/images/img_logo.jpg		
		}
		
		subparts {
			TRAILER = IMAGE
			TRAILER {
				params = id="frontimage"
				altText = Trailerbild
				titleText = Trailerbild
				file = GIFBUILDER
				file {
					XY = 700, 175
					backColor = silver
					format = jpg
					10 = IMAGE
					10.file {
						width = 700
						height = 175
						import {
							cObject = TEXT
							cObject {
								value = fileadmin/templates/img_fahnen.jpg
								override {
									data = levelmedia: -1, slide
									listNum = 0
									required = 1
									wrap = uploads/media/
								}
							}
						}
					}
					
				}
			
			
			}
			
			TOPMENU = COA
			TOPMENU {
				10 = TEXT
				10.value =
				
				20 = HMENU
				20 {
					special = list
					special.value = 3,5,6,8,9
				
					1 = TMENU
					
					# 1.NO.stdWrap.wrap = 1.| || 2.| || 3.| || 4.|
					1.NO.linkWrap = |  |  |*||  |  |*||
					1.NO.ATagParams = class="nav"
					1.NO.ATagTitle.field = abstract // description
									
					
					1.ACT < .1.NO
					1.ACT.ATagParams = class="act"
					1.ACT = 1
					

				}
			}
			
			
			
			
			
			SUBMENU = HMENU
			SUBMENU {
				#special = directory
				entryLevel = 1

				# Erste Menüebene wird definiert
				1 = TMENU
				1 {
					NO {
						wrapItemAndSub = <li>|</li>
						allWrap = <img src="fileadmin/templates/navpfeil_off.jpg" alt="" />
						ATagBeforeWrap = 1
						ATagTitle.field = abstract // description
					}	
					
					
					ACT < .NO
					ACT = 1
					ACT.ATagParams = class="act-1"
					CUR < .NO
					CUR = 1
					CUR.ATagParams = class="cur-1"		
				}

				2 < .1
				3 < .1				
			}
			
			
			
			
			MENU_RIGHT = COA
			MENU_RIGHT {
				10 = TEXT
				10.value =
				
				20 = HMENU
				20 {
					special = list
					special.value = 10,11,12
				
					1 = TMENU
					# 1.NO.stdWrap.wrap = 1.| || 2.| || 3.| || 4.|
					1.NO.linkWrap = |  |  |*||  |  |*||
					1.NO.ATagTitle.field = abstract // description
				}
			}
								
			ROOTLINE = COA
			ROOTLINE {
				10 = TEXT
				10.value = Home
				10.wrap = | » 
				# 3 ist UID der Startseite
				10.typolink.parameter = 3
				
				20 = HMENU
				20 {
					special = rootline
					special.range = 1|-1
					1 = TMENU
					1.NO {	
						
						linkWrap = ||*| » |				
						doNotLinkIt = 0 |*| 0 |*| 1
						ATagTitle.field = abstract // description
					}
				}
			}
			
		
			CONTENT_NORMAL = CONTENT	
			CONTENT_NORMAL {
				table = tt_content
				select {
					where = colPos = 0
					languageField = sys_language_uid
					orderBy = sorting
				}
			}
			CONTENT_MARGIN = CONTENT
			CONTENT_MARGIN {
				table = tt_content
				slide = -1
				slide {
					collect = -1
					collectReverse = 1
				}
				select {
					where = colPos = 3
					orderBy = sorting
					languageField = sys_language_uid
				}
			}
			
			NEWS = TEXT
			NEWS.value = 
		}
	}
}



[globalVar = GP:L=1]
# Englisch
config {
	language = en
	locale_all = en_EN
	sys_language_uid = 1
}
[global]

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type" />
  <title>ls</title>
  <base href="file:///C:/Dokumente%20und%20Einstellungen/Michael%20Pachan/Desktop/L+S_Website/designvorlage_ls.html" />
  <link type="text/css" rel="stylesheet" href="screen.css" />
</head>
<!--###DOKUMENT### begin-->
<body>
<table style="text-align: left; width: 100%; height: 100%;" border="0" cellpadding="0" cellspacing="0">
  <tbody>
    <tr>
      <td style="vertical-align: top; width: 30px; height: 100px;"></td>
      <td style="text-align: left; width: 700px; vertical-align: bottom;">###HEADLINE###<br />      </td>
      <td style="text-align: center; vertical-align: bottom;">###LOGO###<br />      </td>
      <td style="width: 15px;"></td>
    </tr>
    <tr>
      <td style="vertical-align: top; height: 175px;">###LINIEN###<br />      </td>
      <td style="vertical-align: top; height: 175px; width: 700px; white-space: nowrap;"><!-- ###TRAILER### --><img style="width: 700px; height: 175px;" alt="" src="img_l+s/img_fahnen.jpg" /><!-- ###TRAILER### --><br />      </td>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td style="height: 30px; background-color: rgb(255, 236, 0);"></td>
      <td style="background-color: rgb(0, 87, 156);">
      <div id="nav"><ul><!-- Begin ###TOPMENU### -->
      <li><a href="#">Unternehmen</a></li>
      <li><a href="#">Aktuelles</a></li>
      <li><a href="#">Produkte</a></li>
      <li><a href="#">Download</a></li>
      <li><a href="#">Kontakt</a></li>
      <li><a href="#">Login</a></li>
      <li><a href="#">Suche</a></li>
      </ul></div>
<!-- End ###TOPMENU### --></td>
      <td style="background-color: rgb(0, 87, 156);">
      <!-- Begin ###MENU_RIGHT### --></td><!-- End ###MENU_RIGHT### -->
      <td></td>
    </tr>
    <tr>
      <td style="height: 70px;"></td>
      <td><div id="rootline"><!-- Begin ###ROOTLINE### --></td><!-- End ###ROOTLINE### --></div>
      <td style="background-color: rgb(239, 239, 239);"> ##RAND###</td>
      <td style="background-color: rgb(255, 255, 255);"></td>
      <td></td>
    </tr>
    <tr>
      <td style="vertical-align: top;"></td>
      <td style="vertical-align: top;"><table width="700" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td style="vertical-align: top; width: 150px;">
          <div id="nav2"><ul><!-- Begin ###SUBMENU### --></td></ul><!-- End ###SUBMENU### --></div>
          <td style="vertical-align: top; width: 500px;">
          <!-- Begin ###CONTENT_NORMAL### --></td><!-- End ###CONTENT_NORMAL### -->
        </tr>
      </table></td>
      <td style="vertical-align: top; background-color: rgb(239, 239, 239);"><!-- Beginn Randspalte -->
      <div id="rechts">
      <h3>Aktuelles</h3>
      <p>Ich bin Blindtext. Von
Geburt an. Es hat lange gedauert, bis ich
begriffen habe, was es bedeutet, ein blinder Text zu sein: </p>
      </div>
<!-- Ende Randspalte --> </td>
      <td></td>
    </tr>
  </tbody>
</table>
<!--###DOKUMENT### end-->
</body>
</html>

http://p16981.typo3server.info

Unbekannter Benutzer · 2. August 2006 14:21

ist ja komisch,

versuch mal im CSS folgendes anstatt dem geposteten Teil:

a.nav{
text-decoration:none;
color:#ffffff;
}

a.nav:visited{
text-decoration:none;
color:#ffffff;
}

a.cur{
text-decoration:none;
color:#ffec00;
}

a.act{
text-decoration:none;
color:#ffec00;
}

a.nav:hover{
text-decoration:none;
color:#ffec00;
}

michelt3 · 2. August 2006 14:58

Hallo Christian,

tja Dein Vorschlag war schon ganz gut. So funktioniert
es auch im Explorer. Aber nur wenn ich die CSS
für allgemeine Links rausnehmen. Außerdem funktionieren
jetzt das SUBMENU nicht mehr bzw. die Zustände.

Was nun?

michelt3 · 2. August 2006 15:21

Hallo Christian,

nochmals genau. Also ich hab das jetzt nochmal gecheckt.
So wie Du gepostet hast, funktioniert das TOPMENU einwandfrei.

Auch die CSS für das SUBMENU für ACT funktioniert.
Allerdings weder der NO noch RO-Zustand.

Hast Du ne Idee woran das jetzt liegen kann?

Gruß Michael

toyde · 2. August 2006 15:32

Auch die CSS für das SUBMENU für ACT funktioniert.
Allerdings weder der NO noch RO-Zustand.

Hast Du ne Idee woran das jetzt liegen kann?

Über TypoScript vergibts Du der Navigation lediglich allfällige CSS-Klassen(auf dein Problem bezogen). Falls diese korrekt im Quellcode auftauchen, ist dein Problem kein TYPO3-spezifisches mehr. Der RO-Zustand ist bei einem TMENU ohnehin ein CSS-Thema und kann entsprechend im Netz nachgelesen werden.
Ein Hyperlink möchte komplett definiert werden. Mit link, visited, hover, active. Details am Besten in einem CSS-Tutorial nachlesen.

Nebenbei macht's nicht wirklich Sinn CUR und ACT gleichzeitig einzusetzen.

grüsse

michelt3 · 2. August 2006 15:49

Ja ok, mit dem RO Zustand über CSS ist schon klar.
Der RO und NO Zustand hat bisher ja auch funktioniert.

Nur jetzt nachdem ich das CSS für das TOPMENU umgestellt habe
wie mir geraten worden ist, funktioniert zwar dieses TOPMENU
aber alle anderen Menus nicht mehr.

Da frag ich mich nun, woran das jetzt liegt?

michelt3 · 3. August 2006 11:34

Hallo zusammen,

ja manchmal sollte man Probleme etwas ruhen lassen,
dann sieht man auch wieder klar. Also jetzt ist alles ok -
der Fehler lag natürlich bei mir.

Nochmals besten Dank für Eure Hilfe.

Grüße Michael