Grandmaster
Liebe Kollegen,
ich entwerfe derzeit eine neue Homepage und habe ein Problem mit meinem Javascript-Menu. Im Firefox und Internet Explorer 7 wird alles richtig dargstellt, das Menu öffnet sich richtig und der CSS-Style passt auch.
Aber im IE6 passt es gar nicht, es öffnet sich zwar, aber style passt gar nicht :/
JavaScript-Menu:
CSS-Menu:
Vielleicht kann mir jemand in meinem JavaScript-Code den Style so umändern, sodass er im IE6 gleich ausschaut wie im IE7 und Firefox.
Ich stehe nämlich gerade total an und ich bin echt nicht der JavaScriptprofi
EDIT: Habs gelöst indem ich alles dem a und a:hover zugewiesen habe, klappt jetzt überall wunderbar!
Gruss,
replay_
ich entwerfe derzeit eine neue Homepage und habe ein Problem mit meinem Javascript-Menu. Im Firefox und Internet Explorer 7 wird alles richtig dargstellt, das Menu öffnet sich richtig und der CSS-Style passt auch.
Aber im IE6 passt es gar nicht, es öffnet sich zwar, aber style passt gar nicht :/
JavaScript-Menu:
Code:
if(window.navigator.systemLanguage && !window.navigator.language) {
function hoverIE() {
var LI = document.getElementById("menu").firstChild;
do {
if (sucheUL(LI.firstChild)) {
LI.onmouseover=einblenden; LI.onmouseout=ausblenden;
}
LI = LI.nextSibling;
}
while(LI);
}
function sucheUL(UL) {
do {
if(UL) UL = UL.nextSibling;
if(UL && UL.nodeName == "UL") return UL;
}
while(UL);
return false;
}
function einblenden() {
var UL = sucheUL(this.firstChild);
UL.style.display = "block"; UL.style.backgroundColor = "silver";
}
function ausblenden() {
sucheUL(this.firstChild).style.display = "none";
}
window.onload=hoverIE;
}
Code:
#menu {list-style-type:none; background:#df031d; padding:0; margin:0; width:125px; position:absolute; top:162px; left:30px; border:1px solid #fff; border-width:0 1px 1px; z-index:100;}
#menu ul {list-style-type:none; padding:0; margin:0;}
#menu li {float:left; background:#df031d; position:relative; border-top:1px solid #fff;}
#menu li.sub {background:#df031d;}
#menu li, #menu li a {display:block; color:#fff; font-family:arial, sans-serif; font-size:11px; line-height:24px; width:125px; text-decoration:none; cursor:pointer; font-weight:bold; text-indent:5px;}
#menu ul,
#menu li:hover ul ul,
#menu li:hover ul li:hover ul ul {display:none;}
#menu li:hover {color:#ff0; z-index:500; background:url(frog_arrow.gif) no-repeat top right;}
#menu li:hover ul {display:block; height:100px;}
#menu li:hover ul li:hover ul,
#menu li:hover ul li:hover ul li:hover ul {display:block; position:absolute; left:110px; top:-1px; border:1px solid #fff; border-width:0 1px 1px; height:auto;}
#menu li:hover ul li.fly {background: #657 }
#menu li:hover ul li:hover {background:#98a url(frog_arrow.gif) no-repeat top right;}
#menu li:hover ul li:hover ul li {background:#c60;}
#menu li:hover ul li:hover ul li.hover ul li {background:#780; z-index:500;}
#menu li:hover ul li:hover ul li.fly {background: #c60 url(frog_arrow.gif) no-repeat top right;}
#menu li:hover ul li:hover ul li:hover {z-index:500; background:#fa4;}
#menu li:hover ul li:hover ul li:hover a {color:#000;}
#menu li:hover ul li:hover ul li:hover ul li:hover {background:#aa0;}
#menu li:hover ul li:hover ul li.hover ul li:hover a {color:#fff;}
Vielleicht kann mir jemand in meinem JavaScript-Code den Style so umändern, sodass er im IE6 gleich ausschaut wie im IE7 und Firefox.
Ich stehe nämlich gerade total an und ich bin echt nicht der JavaScriptprofi
EDIT: Habs gelöst indem ich alles dem a und a:hover zugewiesen habe, klappt jetzt überall wunderbar!
Gruss,
replay_
Zuletzt bearbeitet: