Problem mit 2 stufigen Menü
Hallo zusammen...
Ich hab hier folgendes Problem:
Ich habe ein Menü mit 2 Stufen (horizontal). Sobald jemand auf die erste Stufe klickt, klappt die 2. aus und bleibt auch stehen. Soweit so gut, das hab ich alles hinbekommen.
Wenn ich aber jetzt in der 2. Stufe auf einen Link klicke, möchte ich das die 2. Stufe immernoch stehen bleibt... Und auch die Schriftarten sollten statt gelb auch grau sein... Ich hab euch unten mal den Templace, CSS und HTML Code reingepackt.
Ich hoffe Ihr könnt mir weiterhelfen, bin schon halb am verzweifeln...
Vielleicht könnte ich es so steuern wenn ich der dem UL in den subitems eine Klasse zuteilen kann, im nav template ist aber nur "echo item['subitems'];". Weis einer wo ich diese Klasse einfügen kann?
HTML:
HTML-Code:
<div id="menu">
<ul>
<li><a href="index.php/kontakt.html" title="Kontakt">Kontakt</a>
<ul>
<li><a href="index.php/geschaeftsfuehrung.html" title="Geschäftsführung">Geschäftsführung</a></li>
<li><a href="index.php/adresse.html" title="Adresse">Adresse</a></li>
<li><a href="index.php/anfrage.html" title="Anfrage">Anfrage</a></li>
<li><a href="index.php/standort.html" title="Standort">Standort</a></li>
</ul>
</li>
<li><a href="index.php/info.html" title="Info">Info</a>
<ul>
<li><a href="index.php/veranstaltungen.html" title="Veranstaltungen">Veranstaltungen</a></li>
<li><a href="index.php/pipettor-info.html" title="Pipettor-Info">Pipettor-Info</a></li>
</ul>
</li>
<li><a href="index.php/produkte.html" title="Produkte">Produkte</a>
<ul>
<li><a href="index.php/oem-pipettoren.html" title="OEM-Pipettoren">OEM-Pipettoren</a></li>
<li><a href="index.php/massgeschneidert.html" title="Massgeschneidert">Massgeschneidert</a></li>
</ul>
</li>
<li><a href="index.php/kompetenzen.html" title="Kompetenzen">Kompetenzen</a>
<ul>
<li><a href="index.php/betreuung-von-a-z.html" title="Betreuung von A-Z">Betreuung von A-Z</a></li>
<li><a href="index.php/entwicklung.html" title="Entwicklung">Entwicklung</a></li>
<li><a href="index.php/qualitaet.html" title="Qualität">Qualität</a></li>
</ul>
</li>
<li><a href="index.php/unternehmen.html" title="Unternehmen">Unternehmen</a>
<ul>
<li><a href="index.php/philosophie.html" title="Philosophie">Philosophie</a></li>
<li><a href="index.php/mitarbeiter.html" title="Mitarbeiter">Mitarbeiter</a></li>
<li><a href="index.php/karriere.html" title="Karriere">Karriere</a></li>
</ul>
</li>
</ul>
</div>
CSS:
HTML-Code:
#menu {
width: 800px;
height: 380px;
position: absolute;
margin: 0;
padding: 0;
background-image: url("tl_files/***/images/background-menu.jpg");
background-repeat: repeat-x;
font-weight: bold;
font-size: 14px;
list-style-type: none;
}
#menu .active a {
color: rgb(251,189,26);
}
#menu a {
text-decoration: none;
color: rgb(76,76,78);
}
#menu a:hover {
text-decoration: none;
color: rgb(251,189,26);
}
#menu ul {
margin: 0 28px 0 0;
padding: 0;
list-style-type: none;
}
#menu .active ul {
top: 28px;
position: absolute;
display: block;
text-align: left;
left: 0px;
}
#menu .active {
background-color: rgb(255,255,255);
color: rgb(251,189,26);
}
#menu li {
width: 115px;
height: 30px;
float: right;
text-align: center;
text-decoration: none;
line-height: 30px;
}
#menu li ul {
display: none;
}
#menu li ul li {
width: 200px;
float: none;
padding-left: 27px;
text-align: left;
}
Navigations Template:
HTML-Code:
<ul>
<?php foreach ($this->items as $item): ?>
<?php if ($item['isActive']): ?>
<li class="active"><?php echo $item['link']; ?><?php echo $item['subitems']; ?></li>
<?php else: ?>
<li><a href="<?php echo $item['href']; ?>" title="<?php echo $item['pageTitle'] ? $item['pageTitle'] : $item['title']; ?>"<?php if ($item['tabindex']): ?> tabindex="<?php echo $item['tabindex']; ?>"<?php endif; ?><?php if ($item['nofollow']): ?> rel="nofollow"<?php endif; ?><?php echo $item['target']; ?>><?php echo $item['link']; ?></a><?php echo $item['subitems']; ?></li>
<?php endif; ?>
<?php endforeach; ?>
</ul>
Ich danke schon jetzt für eure Tipps!
Liebe Grüsse
Extremo
