|
|||
IE 8, Menü klappt wegen Transparenz nicht auf
Hallo,
ich habe eine Navigation für meine Seite erstellt und ich habe Probleme mit dem Internet Explorer 8, das Menü klappt nicht auf! Ich weiß das es an der Transparenz liegt "filter: alpha(opacity=60)" Weiß jemand eine Lösung? Code:
/** navigation **/ #navigation { float:left; width: 550px; margin:auto; height: 60px; font-family: 'Open+Sans', sans-serif; font-size:16px; text-align: center; padding-left:35px; } div#hmenu {height:25px; padding-top:0px;} div#hmenu ul { list-style:none; } div#hmenu li { line-height:16px; float: left; padding-left:0px; padding-right:0px; padding-bottom:11px; padding-top:11px; width: 130px; background-color: #fff; opacity: .6; filter: alpha(opacity=60); } div#hmenu li:hover { background-color: white; opacity: .9; filter: alpha(opacity=90); width: 130px; color: #000000;} div#hmenu li a{ text-decoration: none; font-size:16px; color: #000000; } div#hmenu li a:hover {color:#0f69ae; opacity: .5; filter: alpha(opacity=50);} div#hmenu li ul li{opacity: 1.00 !important; filter: alpha(opacity=100) !important; background-color: white !important; color:#000 !important; } div#hmenu li ul li a{color:#000 !important; } /*--definiert die "Drop-Down-Links" im Normalzustand--*/ #hmenu ul li ul { padding-top: 11px; background-image:none; padding-left: 0px important; width: 130px; text-align: center; } #hmenu ul li ul li { width: 100%; background-color: #fafafa; padding-top: 5px; padding-bottom:5px; background-image:none; padding-left: 0px important; } #hmenu ul li ul li:hover { background-image:none; } #hmenu ul li ul li a { padding-left: 0px important;padding-top:5px; font-size:12px; font-weight: normal; color: #6e6e6e; background-image:none; } #sub li a{ border: 2px solid #073982; border-top: 1px solid #fff; font-size:12px !important; padding:3px; padding-bottom:6px; line-height: 16px; background-color: #f5f5f5; margin-left:2px; } #sub li a:hover{ background-image:url(images/hoverback.jpg); background-repeat:no-repeat; color: #fff; text-decoration:none; border-top: 1px solid #073982; } /*--definiert die "Drop-Down-Links" im Hoverzustand--*/ #menu a:hover { color: #fff; } /* *verhindert im Zusammenhang mit position absolute bei ul ul *eine Höhenvergrößerung von #menu beim Hovern-- */ #hmenu li { position: relative; z-index:50 !important; } /*--versteckt die "Drop-Down-Links", solange nicht gehovert wird--*/ #hmenu ul ul { position: absolute; z-index: 2; display: none; } #hmenu ul li ul li ul li{ position: relativ; top:-35px; left:0px; z-index: 2; margin-left: 130px; width:150px; display: none; } #hmenu ul li ul li ul li:hover{ width:150px; } /*--lässt die Dropdown-Links beim Hovern erscheinen--*/ #hmenu ul li:hover ul { display: block; } #hmenu li li:hover li{ display: block !important; } /*--nur für IE-Versionen kleiner gleich 6 erkennbar--*/ * html #hmenu ul li { float: left; width: 100%; } /*--nur für IE 7 erkennbar--*/ *+ html #hmenu ul li { float: left; width: 100%; } /** Menü Punkt für die startseite verstecken **/ li.item-109 {display:none;} /*--ENDE NAVIGATION--*/ |
Sponsored Links |
|
|||
Firefox:
Die URL der Seite aufrufen, dann rechtsklick und -> Seitenquelltext anzeigen auswählen. Schön wäre es, wenn nur der relevante Teil des HTML Codes gepostet wird, alternativ kannst du auch einen Link zu deiner Seite bereitstellen. |
|
|||
ich hoffe ich habe den richtigen teil des codes eingefugt! ein link geht nicht, mochte der Betreiber der Seite nicht!
Code:
<div id="navigation"> <div id="hmenu"> <div class="moduletable_menu"> <ul class="nav menunav-pills"> <li class="item-103 active divider deeper parent"><span class="separator"> aaaaaaaaa</span> <ul class="nav-child unstyled small"><li class="item-109 current"><a href="/" >Start Leer</a></li><li class="item-133"><a href="/aaaaaaaaa/sdsdsd.html" >asasasasdsd</a></li><li class="item-110"><a href="/aaaaaaaaa/bbbbbbb.html" >bbbbbbb</a></li><li class="item-111"><a href="/aaaaaaaaa/ccccccc.html" >ccccccc</a></li><li class="item-125"><a href="/aaaaaaaaa/ddddddd.html" >ddddddd</a></li></ul></li><li class="item-113 divider deeper parent"><span class="separator"> qwqwqwqwqw</span> <ul class="nav-child unstyled small"><li class="item-124"><a href="/iiiiiiii/ggggggg.html" >fffffff</a></li><li class="item-126"><a href="/iiiiiiii/yyyyyyy.html" >yyyyyyy</a></li><li class="item-127"><a href="/iiiiiiii/gggggggg.html" >gggggggg </a></li><li class="item-139"><a href="/iiiiiiii/fdgdfdfdg.html" >iiiiiiiiiii</a></li></ul></li><li class="item-114 divider deeper parent"><span class="separator"> jkjkjkj</span> <ul class="nav-child unstyled small"><li class="item-128"><a href="/bbbbbbnbn/vvvvvvv.html" >vvvvvvv</a></li><li class="item-129"><a href="/kjkhkhkhjjj/fgfgfgfgfg.html" >gfgfgfgfg</a></li><li class="item-130"><a href="/ffffdfdfd/sssssss.html" >Seminar</a></li></ul></li><li class="item-115"><a href="/saasasa.html" >asasasasa</a></li></ul> </div> </div><!--#hmenu--> </div><!--#navigation--> |
|
|||
Hallo,
Das "opacity ... filter -Zeug" spricht nur Internet Explorer an, nicht die anderen Browser. Außerdem wirst du beim Validator Fehlermeldung bekommen wegen dem "Zeug". Nimm es also aus deinem allgemeinen stylesheet raus und erstelle ein CSS nur für IE, welches Du z.B. "ie-fix" benennst. Dann setzt Du in den Head wo auch dein anderes stylesheet gefunden wird folgendes: Code:
<!--[if lt IE 10]><link href="css/ie-fix.css" rel="stylesheet" type="text/css"><![endif]--> Dann schau erstmal dass Dein Menü in anderen Browsern richtig funktioniert. Danach schreibst Du im oben genannten stylesheet was beim IE-8 (und anderen IE'S) anders sein soll. Hier kommt z.B. schon mal das er den "link:visited" gerne möchte. Ob du nun unbedingt für den ein opcity (dursichtigkeit des Hintergrundes) haben willst bleibt dann noch offen. Ein link zu deiner Seite wäre gut. |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Menü auf Startseite funktioniert nach FORM SUBMIT nicht mehr | Ceres82 | (X)HTML | 3 | 23.08.2013 21:00 |
Darstellungsproblem | flohpapa | CSS | 3 | 16.12.2009 08:55 |
Vertikale Navigation: IE6 - Whitespace-Bug? | b.erry | CSS | 6 | 12.02.2009 16:46 |
Umbruch in einem LI bei horizontalem Menü | M4rco | CSS | 12 | 13.10.2006 11:26 |
Navigation - Menü | T.S. | CSS | 6 | 18.02.2006 18:49 |