[Html] Droppdownmenu

10/18/2011 11:55 Levi$#1
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 -.-
10/18/2011 11:59 sava#2
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).
10/18/2011 12:03 .SaFe#3
edit: damnd :D verlesen

Schau doch mal bei selfhtml vorbei, da findeste sicher was
10/18/2011 12:11 Levi$#4
Quote:
Originally Posted by .SaFe View Post
edit: damnd :D 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
10/18/2011 12:30 sava#5
Schau dir doch das mal an (jQuery Accordion):
[Only registered and activated users can see links. Click Here To Register...]
10/18/2011 13:44 Levi$#6
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;
} 
10/18/2011 19:50 NotEnoughForYou#7
die tag namen nohc klein, dann passt alles ;)
10/18/2011 23:45 Ennea#8
Hab da vor einiger Zeit auch mal was interessantes gefunden, was da auch recht nützlich sein könnte:
[Only registered and activated users can see links. Click Here To Register...]
10/19/2011 13:52 JacK le chilla#9
wie schon 20 gesagt haben :) benutz einfach jQuery ;) ansonsten Googlen :)
10/19/2011 15:07 Ennea#10
Quote:
Originally Posted by JacK le chilla View Post
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.
10/21/2011 14:14 mrapc#11
Hey ich hab auch vor 2 Monaten mit html angefangen
ich epfehle dir daher [Only registered and activated users can see links. Click Here To Register...]
Zwar auf Englisch aber gute Codes, einfach zu verstehen und viele Kommentare...