✔ Menü-Problem

[Kaeschdin]

Hallo zusammen,

ich hätte im Menü der folgenden Seite gern zwei Dinge geändert, bekomme es aber nicht hin: http://www.schmellenkamp.de

1. Wenn ich einen Menüpunkt anklicke (z. B. Clippings), soll die Schrift schwarz bleiben.
2. Wenn ich einen Menüpunkt der zweiten Ebene (z. B. Company --> Profile) anklicke, soll das Untermenü ausgeklappt bleiben und die Schrift des angeklickten Untermenü-Punktes schwarz bleiben.

Wenn ihr Code-Schnipsel braucht, kann ich die gern zur Verfügung stellen.

Danke und viele Grüße,

Kerstin

 

[PuReSteeL]

Hi Kerstin,

du könntest dem aktiven Link eine Klasse zuweisen z.B. class="current" und dieser Klasse die gewünschten Eigenschaften hinzufügen und ebenso dem Submenü die Klasse class="subcurrent".

Ich finde bei Listmatic gibt es ganz gute Beispiele zu dem Thema: http://css.maxdesign.com.au/listamatic2/horizontal03.htm

Viele Grüße
Heiko

 

[Maik]

Hi,

1. Schau dir mal Highlighting current page with CSS und im Falle eines PHP-gestützten Menüs Keeping Navigation Current With PHP an.
2. Hierfür darf dann auf den Unterseiten das Submenü eben nicht ausgeblendet / versteckt werden.

mfg Maik

 

[Kaeschdin]

Das funktioniert so nicht.

Ich glaube, ich muss doch mal weiter ausholen.

Die Navigation wird in jede Seite per include geladen und steht in einer separaten Datei.

Für die erste Menüebene lautet der Code (z. B. Company):

    <a href="#" class="navigation" onMouseOver="MM_showHideLayers('Home','','hide','Company','','show','Services','','hide','Clippings','','hide','Contact','','hide')">COMPANY</a>

Gibt es ein Untermenü (z. B. Company), lautet der Code dafür:

<div id="Company" style="position:absolute; left:87px; top:228px; width:457px; height:13; z-index:2; visibility: hidden;"> 
  <a class="navigation" href="profile.php">PROFILE</a>
  <img src="../media/navitrenner.gif" width="24" height="8">
  <a class="navigation" href="team.php">TEAM</a>
 <img src="../media/navitrenner.gif" width="24" height="8">  
  <a class="navigation" href="jobs.php">JOBS</a>
</div>

Auszug aus der CSS-Datei:

.navigation {
	font-family:Verdana,Arial,Helvetica,sans-serif;
	font-size: 11px;
	color:ffffff;
	text-decoration : none;
}

a:active 
{ 
color:000; 
text-decoration:none; 
}

a:hover 
{ 
color:000; 
text-decoration:none; 
}

 

[Maik]

Hast du innerhalb weniger Minuten alle dei empfohlenen Links verfolgt, vollständig gelesen und ihre jeweiligen Techniken in deiner Seite angewendet und überprüft, dass du zu dieser (voreiligen) Aussage (Behauptung) kommst? :suspekt:

Sorry, dass du kannst du vielleicht deiner Großmutter erzählen, aber nicht mir, denn es funktioniert sehr wohl trotz des includeten Menüs, wie es mein angehängtes Beipspiel demonstriert, das sich auf meine erste Linkempfehlung ("Highlighting current page with CSS") bezieht, und das ich zu Beginn dieses Monats hier im CSS-Board einem anderen User erstellt hatte.

Aber auch meine zweite Linkempfehlung würde dir hier weiterhelfen, wenn du sie denn mal lesen und die Technik auf deine Seiten anwenden würdest.

Und wie ich eben schon zum zweiten Punkt bzgl. des Submenüs schrieb, darf die visibility:hidden-Deklaration in den entsprechenden Unterseiten nicht festgelegt werden.

mfg Maik

 

[Kaeschdin]

Hast du innerhalb weniger Minuten alle dei empfohlenen Links verfolgt, vollständig gelesen und ihre jeweiligen Techniken in deiner Seite angewendet und überprüft, dass du zu dieser (voreiligen) Aussage (Behauptung) kommst? :suspekt:

Hey, du hast meine Aussage schlichtweg falsch verstanden. Es war nicht gemeint, dass deine Lösung falsch ist, sondern dass ICH sie nicht implementieren kann - und das liegt an mir und nicht an dir. Also alles ok.

Jetzt werde ich mal deinen Anhang probieren. Vielleicht bin ich dann ja schlauer.

 

[Maik]

Hey, du hast meine Aussage schlichtweg falsch verstanden. Es war nicht gemeint, dass deine Lösung falsch ist, sondern dass ICH sie nicht implementieren kann - und das liegt an mir und nicht an dir..

Dann solltest du das nächste Mal die Formulierung deiner Aussagen spezifizieren, denn wer soll hier bitte wissen, dass sich

Das funktioniert so nicht.

nicht auf die Techniken, sondern auf dein Unvermögen bezieht

mfg Maik

 

[Kaeschdin]

Dann solltest du das nächste Mal die Formulierung deiner Aussagen spezifizieren, denn wer soll hier bitte wissen, dass sich

Das funktioniert so nicht.

nicht auf die Techniken, sondern auf dein Unvermögen bezieht

mfg Maik

Es tut mir leid, ok?

Zu deinem Lösungsanhang: Danke, das funktioniert soweit ganz gut, ABER:

Wenn ich bei allen Untermenüs (sind drei an der Zahl) die die visibility:hidden-Deklaration lösche, sind die beim Laden einer Seite alle drei parallel ausgeklappt und überlappen sich.

Gibt es keine Lösung, sodass das Menü nur ausgeklappt bleibt, wenn ein Unterpunkt angeklickt wurde?

 

[Maik]

Moin,

selbstverständlich gibt es hierfür eine Lösung, und die hab ich dir eigentlich auch schon mit meinem zuletzt angehängten Beispiel im "Kleinen" (Menü mit einer Ebene) gezeigt, die nun auf das "Große" (Menü mit zwei Ebenen) zu übertragen ist, denn so, wie sich der Link der aktuell geöffneten Seite hervorheben lässt, kann auch mit der entsprechenden Selektor-Regel auf den Unterseiten das Submenü eingeblendet werden.

Hierfür ist aber die Navigation als ein verschachteltes Listenmenü auszuzeichnen, und die vorgestellte CSS-Technik auf die zweite Menüebene, deren enthaltenen Links und Verweisziele anzuwenden.

Als Arbeitsvorlage für das Menü kann ich dir hier Stu Nicholls' Simple dropline menu empfehlen, das, abgesehen von den verwendeten Vorder-/Hintergrundfarben, deinem doch sehr nahe kommt, und zudem kein Javascript benötigt, um die Submenüs ein- und auszublenden.

mfg Maik

 

[Maik]

Hi,

bevor du hier jetzt nur noch "Bahnhof" verstehst, und beim Anblick von Stu Nicholls' Quellcode solch einen Riesenschreck bekommst, dass du in diesem Leben von CSS nichts mehr wissen möchtest, hab ich mich mal daran gesetzt, mein erstes Beispiel entsprechend zu erweitern

Sollten zu der Vorlage weitere Fragen auftauchen, einfach kräftig mit den Fingern schnippen

mfg Maik