Jag har en drop-down meny på min site, vilken definieras i CSS för de flesta webbläsare och JS för IE. För några dagar sedan ville MS att jag skulle uppgradera min IE 6 till IE 7, vilket jag gjorde. Och då ser jag att menyn inte fungerar alls i IE 7!!! :o Det blir aldrig någon drop-down av det!! :x Koden funkar i FF och IE 6.x. Varför inte i IE 7? Och kan någon hjälpa mig att ta fram en lösning för IE 7 också?
//JS-kod som funkar i IE 6.x
sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//Relevant bit av CSS-koden (ligger i php-fil).
/* Avsedd for lankar som alltid ska se otryckta ut i lopande text OCH Huvudmenyn. */
a:link.menu {
color: $mainLinkCol;
}
a:visited.menu {
color: $mainLinkCol;
}
a:hover.menu {
color: $mainLinkHover;
}
a:active.menu {
color: $mainLinkHover;
}
/* STOP menu */
/* Nuvarande (Huvud)Meny - i alternativen*/
.sub {
background-color: $subMenuBG;
color: $mainLinkCol;
width: auto;
}
a:link.submenu {
color: $mainLinkCol;
text-decoration:none;
}
a:visited.submenu {
color: $mainLinkCol;
text-decoration:none;
}
a:hover.submenu {
color: $mainColor;
text-decoration:none;
}
a:active.submenu {
color: $mainColor;
text-decoration:none;
}
/* STOP klasser Huvudmeny*/
/* id=menuDiv Omsluter Huvudmenyn */
#menuDiv .here { /*Kan man skriva sa har? */
color: $secondColor;
}
/* STOP omslutning */
/* id=nav Huvudmenyns lista */
#nav {
list-style: none;
padding: 0;
margin: 0;
}
#nav ul {
padding: 0;
margin: 0;
list-style: none;
}
#nav a {
display: block;
width: 6em;
}
#nav li {
float: left;
width: 6em;
padding: 0.2em 0.5em 0em 0.5em;
}
#nav li ul {
position: absolute;
width: 9em;
left: -999em;
}
#nav li:hover ul {
left: auto;
}
#nav li:hover ul, #nav li.sfhover ul {
left: auto;
}
/* STOP Huvudmenyn */
/* id=currSub Nuvarande Submeny */
#currSub hereS { /*link - lank som annu inte har besokts*/
color: #DC1437;
font-size: 14px;
background-color: $mainBG;
padding: 0px 10px 10px 10px; /* up, right, down, left*/
}
#currSub a:link { /*link - lank som annu inte har besokts*/
color: $thirdColor;
font-size: 14px;
background-color: $secondColor;
padding: 0px 10px 10px 10px; /* up, right, down, left*/
}
#currSub a:visited { /*visited - lank som har besokts*/
color: $thirdColor;
font-size: 14px;
background-color: $secondColor;
padding: 0px 10px 10px 10px; /* up, right, down, left*/
}
#currSub a:hover { /*hover - mouseover*/
color: #DC1437;
font-size: 14px;
background-color: $mainBG;
padding: 0px 10px 10px 10px; /* up, right, down, left*/
}
#currSub a:active { /*active - vid klick*/
color: #DC1437;
font-size: 14px;
background-color: $mainBG;
padding: 0px 10px 10px 10px; /* up, right, down, left*/
}
/* STOP currSub */