XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   dropdown menü einbauen (http://xhtmlforum.de/showthread.php?t=49691)

PatrickM 06.01.2008 12:07

dropdown menü einbauen
 
auf meiner homepage habe ich folgendes menü:

<ul id='menu'>
<li ><a href='index.html' >Startseite</a></li>
<li ><a class='current' href='-' >-</a></li>
<li ><a href='-' >-</a></li>
<li ><a href='-' >-</a></li>
<li ><a href='-' >-</a></li>
<li ><a href='-' >-</a></li>
<li ><a href='-' >-</a></li>

</ul>

und in meiner css datei folgendes:

ul#menu { width: 100%; height: 43px; background: #FFF url("images/menu-bg.gif") top left repeat-x; font-size: 0.8em; font-family: "Lucida Grande", Verdana, sans-serif; font-weight: bold; list-style-type: none; margin: 0; padding: 0; }
ul#menu li { display: block; float: left; margin: 0 0 0 5px; }
ul#menu li a { height: 43px; color: #777; text-decoration: none; display: block; float: left; line-height: 200%; padding: 8px 15px 0; }
ul#menu li a:hover { color: #333; }
ul#menu li a.current{ color: #FFF; background: #FFF url("images/current-bg.gif") top left repeat-x; padding: 5px 15px 0; }


ich würde gerne in das menü ein dropdown menü einbauen, ich habe auch eins gefunden auf Son of Suckerfish Dropdowns | HTML Dog kann man das irgendwie ein mein menü einbauen? einfach dass ich da son dropdown menü drinne hab... ich hab jetzt 2 stunden lang rumprobiert aber habs einfach nicht hinbekommen weil immer wieder was anderes schief gelaufen is

hubspe 06.01.2008 12:52

Hi PatrickM,

schau doch mal in die Faq (erster Fred in CSS), dort sind unter Punkt 8 über Links Anleitungen zu Dropdownmenüs zu finden.

Gruß
Klaus

PatrickM 06.01.2008 12:59

ja aber ich habe ja selbst ein menü gemacht, da soll nur son dropdown eingebaut werden, ich will ja nicht ein anders kopieren

also bei suckerfish das ist der css teil so:

Zitat:

#nav, #nav ul {
padding: 0;
margin: 0;
list-style: none;
}

#nav a {
display: block;
width: 10em;
}

#nav li {
float: left;
width: 10em;
}
#nav li ul {
position: absolute;
width: 10em;
left: -999em;
}

#nav li:hover ul {
left: auto;
}

und für internet explorer:

Zitat:

sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagNam e("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
was genau muss ich denn davon in meine css datei kopieren damit ich ein dropdown menü habe? da is ja das meinste nur formatierung usw.

Crizzo 06.01.2008 18:48

Der IE kapiert kein ":hover" anderen Elementen außer "a". Deshalb braucht man entweder eine sehr gute Technik oder Javascript.

Wo genau kommst du denn nicht weiter?

PatrickM 06.01.2008 19:22

also ich hab ja dieses css menü gemacht, was ich oben beschrieben habe. das geht alles perfekt. nur muss in das menü noch irgendwie son dropdown eingebaut werden... ich hab jetz shconmal dieses eine versucht mit in mein menü reinzukopieren, aber das geht net, immer kahm dann ein anderer fehler was nicht gestimmt hat. ich habs vielleicht 30 ma probier und jedes ma musste ich es löschen
also das einzige was ich jetzt bräuchte wäre, jemanden der sich gut mit css auskennt und mir sagen kann, was für befehle ich jetzt in mein menü mit reinschreiben muss damit aus dem normalen menü son dropdown menü wird

Crizzo 06.01.2008 19:43

CSS-Drop-Downs sind nicht für Anfänger. Du musst dich in CSS und verschiedenen Browserproblemen auskennen.

Du hast eine Liste, in diese wird eine weitere verschachtelt, die verschaltelte wird ausgeblendet und nur eingeblendet, wenn man mit der Maus über den entsprechenden Link fährt.
Bau erstmal eine verschachtelte Liste und versuche das Einblenden hinzubekommen. Um die Positionierung der anderen Liste kannst du dich dann immer noch kümmern.

PatrickM 07.01.2008 17:13

ich kriegs nich hin ;( das mouseover und alles klappt, das is net so schwer, aber dass sich dann so nach unten links öffen klappt einfach net....


Alle Zeitangaben in WEZ +2. Es ist jetzt 04:27 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023