Hallo, ich habe ein Problem worauf ich nicht komme. Ich habe diese Frage auch in einem anderem Forum gestellt, jedoch konnt mir keiner helfen. Ich hoffe, das einer von euch mir den entscheidenen Tipp geben kann.
Folgendes. Ich habe in einer Webseite ein Navigationsleiste/Menüleiste eingefügt, welches mit dynamischer Ein- und Ausblenung arbeitet.
In meinem Beispiel habe ich ein "Test" Button. Wenn ich mit der Maus auf "Test" gehe, dann sollen sich weitere Unterpunkte anzeigen. Aber auch nur wenn ich mit der Maus auf "Test" gehe oder klicke.
Dafür habe ich eine CSS-Datei geschrieben welches diese dynamische Ein-und Ausblendung ermöglicht. Diese Vorgehen klappt auch ganz gut mit dem Mozilla Firefox. Jedoch kann ich es mit dem InternetExplorer nicht realisieren.
Ich komme auch nicht daruf, wie ich es machen soll. Hab viel rumporbiert und gegooglet aber nicht schlau geworden.
Beim InternetExplorer wird "Test" ohne seine Unterpunkte angezeigt, wenn ich mit der Maus auf diesen Button gehen.
was kann ich da machen? wahrscheinlich ist es nur ein 3 Zeilter für die CSS-Datei.
Hier habt ihr mal die CSS und HTML Code. Ich wäre euch sehr dankbar für eure hilfe
Code zu HTML(Menüleiste):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<LINK REL=stylesheet HREF="nav_bak.css" TYPE="text/css">
</head>
<body leftmargin="0" rightmargin="5" topmargin="3">
<div id="Rahmen"><ul id="Navigation">
[*][url='beispiel.html']Beispiel[/url]
[*][url='beisiel2.html']Beispiel2[/url]
[*][url='beispeil3.html']Beispiel3[/url]
[*][url='beispiel4.html']Beispiel4[/url]
[*][url='beispiel5.html']Beispiel5[/url]
[*][url='#Test']Test[/url]
<ul>
[*][url='test1.html']Test1[/url]
[*][url='test2.html']Test2[/url]
[*][url='test3.html']Test3[/url]
[*][url='test4.html']Test4[/url]
[/list]
</div>
</body>
</html>und hier ist der Code für die CSS-Datei:
td {font-size: 16px; color:#FFFFFF; font-weight : bold; background-color : #942428;}
.nav {font-size: 16px; color:#000000; font-weight : bold; background-image : #ffffff;}
a { font-size: 16px; text-decoration: none; font-weight : bold;}
a:link {color:#E9E9E9; }
a:visited { color:#E9E9E9; }
a:active {color:#E9E9E9; }
a:hover{color: #942428; bgcolor:#FFFFFF;}
body {
font-family: "Trebuchet MS";
font-size: 16px;
font-weight: bolder;
text-decoration: none;
margin-left:5;
}
ul#Navigation {
width:auto;
color:black;
height:auto;
background:transparent;
padding:0px;
border: none;
}
* html ul#Navigation { /* Korrekturen fuer IE 5.x */
width: 97px;
w\idth: 0em;
padding-left: -3em;
padd\ing-left: -2em;
margin-left:-5em;
}
ul#Navigation li {
list-style: none;
margin: 0.1em; padding: 0;
}
ul#Navigation li ul {
margin: 0 0 0 1em; padding: 0;
}
ul#Navigation li ul li {
margin: 0.2em 0;
}
* html ul#Navigation li ul li { /* Korrektur fuer IE 5.x */
margin-left: 1px; /* 1 */
ma\rgin-left: 1em;
display:none; top: 0.6em;
}
ul#Navigation a {
color:E9E9E9;
margin:2px 0;
text-decoration:none;
display:block;
border: none;
width:97px;
background-image: url(images/nav_td-img.jpg);
background-repeat: no-repeat;
height: 25px;
padding-top: 2px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 5px;
}
* html ul#Navigation a {
width: 97px; /* Breitenangabe fuer IE 5.x */
w\idth: 20em; /* Breitenangabe fuer IE 6 */
margin-left:5.7em;
}
* html ul#Navigation li ul li a {
width: 97px; /* Breitenangabe fuer IE 5.x */
w\idth: 20em; /* Breitenangabe fuer IE 6 */
margin-left:5.7em;
display: block;
display:none; top:auto;
}
ul#Navigation a:hover {
color:#942428;
background-image: url(images/nav_td-img_white_and_rand2.jpg);
background-repeat: no-repeat;
border: none;
}
/* Erweiterung zur dynamischen Ein-/Ausblendung */
ul#Navigation li>ul {
display:none; top: 0.6em;
}
ul#Navigation li:hover>ul, ul#Navigation li>a#aktuell+ul {
display: block;
}
/* Workaround fuer den IE 7 */
*:first-child+html ul#Navigation ul {
padding-bottom:0.4em;
}