# Dropline Menu erstellen in CSS Vorlage vorhanden



## moa75 (1. Februar 2009)

Hallo zusammen,

ich möchte gerne ein DROPLINE MENU erstellen komplett in CSS ohne java!
Folgenden Code habe ich schon vorbereitet. Aber ich möchte gerne das wenn mann über den Link HAUPTMENU mit der Mouse drüber fährt sich ein submenu öffnet. Klickt man auf den Hauptmenu  soll das submenu geöffnet bleiben. Soweit habe ich es schon realisiert, nur mein Problem ist, wie kann mann anstatt <p> auch links definieren ? 

Folgender Code der Funktioniert wie es sein soll nur hald keine Links:

<style type="text/css">
#menu{
	position:absolute;
	top:49px;
	left:320px;
	width:100px;
}
#menu ul {display: block;}
#menu a p {display: none;}
#menu a:hover p, #menu a:focus p {display: block; }
</style>
<div id="menu">

<a href="#nogo">hauptmenu<p>untermenu als test aber einen link bekomme ich da net hin und horizontal auch net :-( </p></a></div>

Kann mir da jemand bitte weiter helfen? Ich möchte auch das die Links horizontal im submenu dann dargestellt werden. Nett wäre es auch wenn mann statt den Text auch bilder einfügen könnte.

gruß
moa


----------



## Maik (1. Februar 2009)

Hi,

Dropline- oder Dropdown-Menüs werden üblicherweise im HTML-Code mit einem Listenelement ausgezeichnet, so wie es mit dem Selektor "#menu ul" in deinem Stylesheet auch ansatzweise angegeben ist 


```
<div id="menu">
    <ul>
        <li><a href="#">...</a></li>
        ...
    </ul>
</div>
```

Siehe hierzu auch Son of Suckerfish Dropdowns, und weil du das Dropline-Menü ohne Javascript umsetzen möchtest, schau dir Stu Nicholls'   Beispiele (Kategorie: "Menus - Multi-Level - Dropline") an, sofern du den IE6 berücksichtigen möchtest.

mfg Maik


----------



## moa75 (1. Februar 2009)

hi ,

das mit 

<li><a href="#">...</a></li>

habe ich schon getestet nur will dann das dropline nicht mehr !!  die Stu Nicholls' Beispiele habe ich mir auch schon reingezogen aber dort bleibt das sub nicht offen wenn man drauf klickt nur bei mausover keine eine lösung?

gruß
moa


----------



## Maik (1. Februar 2009)

moa75 hat gesagt.:


> das mit
> 
> <li><a href="#">...</a></li>
> 
> habe ich schon getestet nur will dann das dropline nicht mehr !!


Dann muß das o.g.  Stylesheet auch umgeschrieben werden.

```
#menu ul li ul { display:none; }
#menu ul li:hover ul { display:block; }
```



moa75 hat gesagt.:


> die Stu Nicholls' Beispiele habe ich mir auch schon reingezogen aber dort bleibt das sub nicht offen wenn man drauf klickt nur bei mausover keine eine lösung?



Wenn die Submenüs nach dem Anklicken der Hauptmenüpunkte geöffnet bleiben sollen, wirst du nicht um den Einsatz von Javascript herumkommen:


Click brick dropdown menu
Click through flyout menu

mfg Maik


----------



## 0815-51 (9. März 2010)

Hallo, geht das nicht wenn in dem submenu z.b. auf der startseite einfach nichts drin ist weiss oder transparent aber das submenu ansonsten permanent da ist?
Danke


----------



## Maik (9. März 2010)

0815-51 hat gesagt.:


> Hallo, geht das nicht wenn in dem submenu z.b. auf der startseite einfach nichts drin ist weiss oder transparent aber das submenu ansonsten permanent da ist?
> Danke


Möglich ist im Leben so ziemlich alles, nur welchen Sinn soll das ergeben?  Ein Submenü, das leer ist :suspekt:

mfg Maik


----------



## 0815-51 (9. März 2010)

...wäre doch eine Lösung oder? das mit der Lücke könnte evtl. mit Transparenz gelöst werden sehe ich aber auch nicht wirklich als Problem bei horizontaler/horizontaler Anordnung oder vertikal/vertikal.
hast du eine andre Lösung ohne Java für das Problem?
Danke


----------



## Maik (9. März 2010)

0815-51 hat gesagt.:


> ...wäre doch eine Lösung oder? das mit der Lücke könnte evtl. mit Transparenz gelöst werden sehe ich aber auch nicht wirklich als Problem bei horizontaler/horizontaler Anordnung oder vertikal/vertikal.
> hast du eine andre Lösung ohne Java für das Problem?
> Danke


Wenn sich dein Problem auf die Frage von moa75 bezieht, wie das Submenü offen gehalten werden kann, und du dies ohne Javascript umsetzen willst, hast du dir doch schon selbst die Lösung geliefert, nur dass das Submenü dann nicht leer sein darf :suspekt:

Übrigens haben Java und Javascript so viel gemeinsam, wie Eishockey und Feldhockey.

mfg Maik


----------



## 0815-51 (9. März 2010)

Ja, Du hast ja recht ich meinte natürlich Javascript;-  und Java und Java (Die Insel Java ist die kleinste der Sunda-Inseln in Indonesien mit etwa 90 Millionen
Einwohnern) 

Hast oder weist Du ein Beispiel für das Menü?
Danke


----------



## Maik (9. März 2010)

0815-51 hat gesagt.:


> Hast oder weist Du ein Beispiel für das Menü?


Nicht direkt.

Du kannst dich aber in Stu Nicholls' http://www.cssplay.co.uk/menus/ (-> Multi-Level - Dropline) umschauen.

Anschliessend modifizierst du das Menü so, dass beim Klick auf einen Hauptmenüpunkt nicht das Submenü geöffnet, sondern die entsprechende Seite geladen wird, in der das Submenü sichtbar ist - ähnlich wie beispielsweise Sliding doors with a drop line oder Professional centered sliding doors dropline menu...

mfg Maik


----------



## 0815-51 (10. März 2010)

danke, dann wollen wir mal


----------

