|
|||
Hover Effekt geht nicht
Ich versuche im moment eine Dropdown Navigation zu erstellen. Der HTML Code sieht so aus:
Code:
<div id="nav" class="mod_navigation block"> <a class="invisible" title="Navigation überspringen" href="index.php/philosophie.html#skipNavigation_4"/> <ul class="level_1"> <li class="submenu trail first"> </li> <li class="submenu"> <a class="submenu" onclick="this.blur();" title="CRACOX" href="index.php/cracox_bearbeitung.html">CRACOX</a> <ul class="level_2"> <li class="first"> <a class="first" onclick="this.blur();" title="Bearbeitung" href="index.php/cracox_bearbeitung.html">Bearbeitung</a> </li> <li> <a onclick="this.blur();" title="Qualitätssicherung" href="index.php/cracox_qualitaetssicherung.html">Qualitätssicherung</a> </li> <li class="last"> <a class="last" onclick="this.blur();" title="Premium Verschleißschutzstahl" href="index.php/cracox_forschung.html">Premium Verschleißschutzstahl</a> </li> </ul> </li> <li> <a onclick="this.blur();" title="Rohstoffgewinnung" href="index.php/rohstoffgewinnung.html">Rohstoffgewinnung</a> </li> <li class="submenu last"> </li> </ul> <a id="skipNavigation_4" class="invisible" title="Navigation überspringen"/> </div> Code:
#nav { list-style-type:none; margin-top:120px; padding:0px; } #nav ul li { float:left; height:3em; list-style-type:none; margin:0px 1px 0px 0px; padding-left:10px; position:relative; z-index:999; } #nav level_2 { left:0pt; position:absolute; top:0pt; } #nav .level_2 li { display:none; } #nav ul li:hover ul li, #nav ul li a:hover ul li { display:block; } |
Sponsored Links |
|
||||
Leider nicht wirklich.
Ich habe mal einen 'Hack' für den IE gesehen, wo das mit ConditionalComments und Tabellen gelöst wurde. Da war der Code für den IE6 dann invalide und für alle anderen valide aber mit vielen Kommentaren versehen. Weiß aber nicht mehr wo und wie das gelöst wurde. Ein andere Möglichkeit wäre für den IE das CSS per JavaScript (onmouseover, onmouseout) zu ändern, was dann natürlich bei deaktiviertem JS zu Problemen führt. Was anderes fällt mir leider nicht ein. |
|
|||
Ich hab die CSS Datei nochmal kompett überarbeit. Sieht jetzt so aus:
Code:
#nav { background-image:url(tl_files/css/bilder/nav.gif); background-repeat:repeat-x; border:1px solid #A2E6CD; bottom:0px; height:21px; left:0px; margin-top:10px; overflow:visible; position:absolute; right:0px; top:110px; width:948px; z-index:999; } #nav * { margin:0pt; padding:0pt; } #nav ul { line-height:1; list-style-type:none; min-width:1%; } #nav a, #nav p { color:#FFFFFF; display:block; font-family:verdana,arial; font-size:11px; font-weight:bold; padding:5px; text-decoration:none; } #nav a:hover { text-decoration:none; } #nav li { float:left; margin-right:20px; min-height:1%; min-width:1%; } #nav li:hover, #nav li.sfhover { background-image:url(tl_files/css/bilder/hover.gif); } #nav ul ul { background-color:#00925B; left:-999em; position:absolute; } #nav li li { clear:left; } #nav li:hover ul, #nav ul li.sfHover ul li { left:auto; } PHP-Code:
Was kann ich machen, bzw. was mach ich falsch? |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Hilfe css Menu center | xXcyberXx | CSS | 5 | 28.11.2010 20:51 |
Problem mit CSS Menü | SMundt | CSS | 9 | 07.01.2009 20:12 |
CSS Navigation - Problem mit IE6 | pcklinik | CSS | 4 | 18.09.2007 13:04 |
Darstellungsproblem CSS Navigation im IE7 | pcklinik | CSS | 7 | 09.09.2007 18:25 |
CSS Einsteiger bittet um Hilfe | pcklinik | CSS | 0 | 06.09.2007 15:40 |