[Html] Droppdownmenu

[Levi$]

hey,

ahm da ich "noch" kein pro bin in sachen html programmierung, ist das ein broken für mich den ich noch nicht lösen kann. Ich will ein droppdown menu erstellen. Komme auch relativ weit schaut es euch einfach an.

PHP Code:

<div id="menu">
        
    <ul>
        
    <li><a href="start.html">Universität</a>
    <ul>     
        <li><a href="#">Universität-Link1</a></li>
        <li><a href="#">Universität-Link2</a></li>
        <li><a href="#">Universität-Link3</a></li>
        <li><a href="#">Universität-Link4</a></li>
    </ul>
    </li>

    
    <li><a href="news.html">Studium</a>
    <ul>
        <li><a href="news.html">Studium-Link1</a></li>
        <li><a href="news.html">Studium-Link2</a></li>
        <li><a href="news.html">Studium-Link3</a></li>
        <li><a href="news.html">Studium-Link4</a></li>
    </ul>
    </li> 


PHP Code:

#menu UL
{
    margin: -202px;
    padding: 50px 0px 0px 354px;
    list-style-type: none;
}
#menu UL LI
{
    padding: 0px 0px 0px 31px;
    margin: 5px;
    width: 20%;
    display: inline;
}
#menu A
{
    color: #000000;
    font-weight: normal;
    font-size: 12pt;
    line-height: 12;
} 


wie ihr sieht, würde ich gerne die obersten menüpunkte in einer liste haben. Habs damit schon so weit, das es mir alle links anzeigt, wenn ich #menu ul li:hover { display:block} eingebe dann "entfalten sich die links auch" jedoch sieht das einfach nur scheise aus =(

danke


ps: bin nach ewig langer suche, auf den begriff span gestosen, hab wiederum diesen auch gegoogelt, und ich glaub ich bin zu dumm diesen zu verstehen, was ich verstanden hab ist, das er bereiche abgrenzen kann. was mir das bei einem droppdown helfen würde? kp -.-

[sava]

Nun du wirst die ja nur Anzeigen/Verstecken ohne Effekte. Für Effekte solltest du dir JavaScript anschauen und dazu eventuell direkt jQuery (oder etwas vergleichbares).

[.SaFe]

edit: damnd verlesen

Schau doch mal bei selfhtml vorbei, da findeste sicher was

[Levi$]

Originally Posted by .SaFe

edit: damnd verlesen

Schau doch mal bei selfhtml vorbei, da findeste sicher was

hab ich. jedoch nichts verwertbares gefunden -.-

also schon nur nicht so simpel wie ichs sozusagen will ^^

meine aufbauweise ist ja richtig nur das "verstecken" brauch ich eben nur

danke

[sava]

Schau dir doch das mal an (jQuery Accordion):

[Levi$]

Lösung:

Html

PHP Code:

<div id="menu">
        
    <ul>
        
    <li><a id="show">Universität</a>
    <ul>     
        <li><a href="#">Universität-Link1</a></li>
        <li><a href="#">Universität-Link2</a></li>
        <li><a href="#">Universität-Link3</a></li>
        <li><a href="#">Universität-Link4</a></li>
    </ul>
    </li> 


css

PHP Code:

/*++++Navigation-Droppdown++++*/
#menu UL LI>UL
{
    display: none;
    top: 1.6em;
}
#menu UL LI:hover>UL, #menu UL LI>A#show
{
    display: block;
} 


[NotEnoughForYou]

die tag namen nohc klein, dann passt alles

[Ennea]

Hab da vor einiger Zeit auch mal was interessantes gefunden, was da auch recht nützlich sein könnte:

[JacK le chilla]

wie schon 20 gesagt haben benutz einfach jQuery ansonsten Googlen

[Ennea]

Originally Posted by JacK le chilla

wie schon 20 gesagt haben

Warum wiederholst du es dann? Wenn man außerdem nicht viel auf Effekte setzt lässt sich die Problematik mit CSS viel einfacher und effizienter lösen.

[mrapc]

Hey ich hab auch vor 2 Monaten mit html angefangen
ich epfehle dir daher
Zwar auf Englisch aber gute Codes, einfach zu verstehen und viele Kommentare...