Navigationsleiste für IExplorer 8 und Firefox

Hallo Leute,

Seitdem der IExplorer 8 da ist, funktioniert meine aufklappbare Navigationsleiste nicht mehr.

Könnt ihr mir eine aufklappbare oder andere schicke Navigationsleiste anraten, die im IExplorer 8 und Firefox problemlos läuft, ohne den Kompabilitätsmodus einzuschalten?

Würd mich über eure Hilfe und Antworten freuen. Vielen Dank schon mal.

P.S. Arbeite mit nvu, also in html, javascript, css, noch kein php oder ähnliches

Hallo PWT,

Schon mal danke für deine Antwort.

Hier der Link:

http://www.tambourkorps-elsenborn.herzeboesch.net

Im IE8 klappen die Ordner nicht mehr auf, nur wenn man den Kompabilitätsmodus anschaltet, und dass möchte ich ja vermeiden.

Was muss ich denn am Script ändern?

Hallo,

So die Fehler sind behoben, aber Navigationsleiste läuft immer noch nicht fehlerfrei in IE8.

Habe hier mal einen Teil des Scripts kopiert:


<style type="text/css" media="screen">
.pd_menu_01 {float:left; padding:0; margin:0;color: #FFFFFF;background: #0000A0;width:968px; border:solid 1px #004080;clear:both;} /*Color navigation bar normal mode*/
.pd_menu_01 a, .pd_menu_01 a:visited {
font-family:Arial, Helvetica, sans-serif;
font-style:normal;
font-weight:bold;
font-size:12px;
color: #FFFFFF;
background-color: #0000A0;
text-decoration: none;
}
.pd_menu_01 ul {list-style-type:none;padding:0; margin:0;}
.pd_menu_01 ul li {float:left; position:relative; z-index:auto !important /*Non-IE6*/; z-index:1000 /*IE6*/; border-right:solid 1px #004080; }
.pd_menu_01 ul li a {color: #FFFFFF;background: #0000A0;float:none !important /*Non-IE6*/; float:left /*IE-6*/; display:block; height:30px; line-height:30px; padding:0 10px 0 10px; text-decoration:none; }
.pd_menu_01 ul li ul {display:none; border:none;color: #FFFFFF;background: #0000A0;}
.pd_menu_01 ul li:hover a {background-color:#008000; text-decoration:none; color:#FFFF00;} /*Color main cells hovering mode*/
.pd_menu_01 ul li:hover ul {display:block; position:absolute; z-index:999; top:29px; margin-top:1px; left:0;}
.pd_menu_01 ul li:hover ul li a {display:block; width:12em; height:auto; line-height:1.3em; margin-left:-1px; padding:5px 10px 5px 10px; border-left:solid 1px #004080; border-bottom: solid 1px #004080; background-color:#0000FF; color:#FFFFFF;} /*Color subcells normal mode*/
.pd_menu_01 ul li:hover ul li a:hover {background-color:#CA0000; text-decoration:none;color:#FFFF00;} /*Color subcells hovering mode*/
.pd_menu_01 table {position:absolute; top:0; left:0; border-collapse:collapse;color: #FFFFFF;background: #0000A0;}
.pd_menu_01 ul li a:hover {background-color:#008000; text-decoration:none;color:#FFFF00;} /*Color main cells hovering mode*/
.pd_menu_01 ul li a:hover ul {display:block; width:12em; position:absolute; z-index:999; top:29px; left:0; }
.pd_menu_01 ul li a:hover ul li a {display:block; width:12em; height:1px; line-height:1.3em; padding:4px 16px 4px 16px; border-left:solid 1px #004080; border-bottom: solid 1px #004080; background-color:#0000FF; color:#FFFFFF;} /*Color subcells normal mode*/
.pd_menu_01 ul li a:hover ul li a:hover {background-color:#CA0000; text-decoration:none;color:#FFFF00;} /*Color subcells hovering mode*/
  </style>
</head>

Für mich ist dass ehrlich gesagt alles "chinesisch", kapiere die javascript Sprache einfach nicht.

Gibt's hier kluge erfahrende Menschen, die sich damit auskennen? Ich wäre euch sehr dankbar.



 

hab grad wenig Zeit, valide ist es ja alles, check mal die height´s im im css. Hier liegt der Hase im Pfeffer...