Phil: Bilderwechsel bei onmouseover problem im IE

Beitrag lesen

Hi alle!
Ich habe ein Problem! Dies tritt allerdings nur im IE und nicht im Mozilla Firefox auf!

http://music-mg.drition.net/
Das ist der Link zu der Page!
Öffnet sie mit dem IE!
Wenn man dann oben auf die Navigations-Button geht, soll sich der Button ändern!
Das tut er per onmouseover!
Beim IE jedoch geh ich auf dfas BIld, dann zeigt er die hintergrund farbe des Div-Containers an und DANN erst das andere Bild........ und das auch noch total langsam... beim Moz.. wird alles flüßig dargestellt!

hier ist der Code:

-----------------------------------
index.php
-----------------------------------
<html>
<head>
<title>test</title>
<link rel="stylesheet" type="text/css" href="basis.css">
<script language="javascript" src="sc.js" type="text/javascript"></script>
</head>
<body>
<a href="index.php">
     <div id="L1" class="LL" onMouseOver="LL(this)" onMouseOut="LL2(this)"></div>
    </a>
    <a href="ma.php">
     <div id="L2" class="link1" onMouseOver="link1(this)" onMouseOut="link2(this)"></div>
    </a>
    <a href="mu.php">
     <div id="L3" class="link3" onMouseOver="link3(this)" onMouseOut="link4(this)"></div>
    </a>
    <a href="sonst.php">
     <div id="L4" class="link5" onMouseOver="link5(this)" onMouseOut="link6(this)"></div>
    </a>
    <a href="links.php">
     <div id="L5" class="link7" onMouseOver="link7(this)" onMouseOut="link8(this)"></div>
    </a>
    <a href="forum.php">
     <div id="L6" class="link9" onMouseOver="link9(this)" onMouseOut="link10(this)"></div>
    </a>
    <a href="kontakt.php">
     <div id="L7" class="link11" onMouseOver="link11(this)" onMouseOut="link12(this)"></div>
    </a>
</body>
</html>

------------------------------------------------------
basis.css
------------------------------------------------------

.LL { width:130px; height:40px; background-image:url(img/buttons/navi.gif) }
.LL2 { width:130px; height:40px; background-image:url(img/buttons/navi1.gif) }
.link1 { width:130px; height:40px; background-image:url(img/buttons/ma.gif) }
.link2 { width:130px; height:40px; background-image:url(img/buttons/ma1.gif)}
.link3 { width:130px; height:40px; background-image:url(img/buttons/mu.gif); margin-left:10px; position:absolute  }
.link4 { width:130px; height:40px; background-image:url(img/buttons/mu1.gif); margin-left:10px; position:absolute  }
.link5 { width:130px; height:40px; background-image:url(img/buttons/so.gif); margin-left:20px; position:absolute  }
.link6 { width:130px; height:40px; background-image:url(img/buttons/so1.gif); margin-left:20px; position:absolute  }
.link7 { width:130px; height:40px; background-image:url(img/buttons/links.gif); margin-left:30px; position:absolute  }
.link8 { width:130px; height:40px; background-image:url(img/buttons/links1.gif); margin-left:30px; position:absolute  }
.link9 { width:130px; height:40px; background-image:url(img/buttons/forum.gif); margin-left:40px; position:absolute  }
.link10 { width:130px; height:40px; background-image:url(img/buttons/forum1.gif); margin-left:40px; position:absolute  }
.link11 { width:130px; height:40px; background-image:url(img/buttons/kontakt.gif); margin-left:45px; position:absolute1  }
.link12 { width:130px; height:40px; background-image:url(img/buttons/kontakt1.gif); margin-left:45px; position:absolute  }

--------------------------------------
sc.js
--------------------------------------
function link1(ele) {
 ele.className = "link2";
 ele.style.cursor = "pointer";
}
function link2(ele) {
 ele.className = "link1";
 ele.style.cursor = "default";
}
function link3(ele) {
 ele.className = "link4";
 ele.style.cursor = "pointer";
}
function link4(ele) {
 ele.className = "link3";
 ele.style.cursor = "default";
}
function link5(ele) {
 ele.className = "link6";
 ele.style.cursor = "pointer";
}
function link6(ele) {
 ele.className = "link5";
 ele.style.cursor = "default";
}
function link7(ele) {
 ele.className = "link8";
 ele.style.cursor = "pointer";
}
function link8(ele) {
 ele.className = "link7";
 ele.style.cursor = "default";
}
function link9(ele) {
 ele.className = "link10";
 ele.style.cursor = "pointer";
}
function link10(ele) {
 ele.className = "link9";
 ele.style.cursor = "default";
}
function link11(ele) {
 ele.className = "link12";
 ele.style.cursor = "pointer";
}
function link12(ele) {
 ele.className = "link11";
 ele.style.cursor = "default";
}
function LL(ele) {
 ele.className = "LL2";
 ele.style.cursor = "Pointer";
}
function LL2(ele) {
 ele.className = "LL";
 ele.style.cursor = "default";
}

-----------------------------------------------------
-----------------------------------------------------
-----------------------------------------------------

Das wars !

Ich hoffe ihr könnt mir helfen!

MFG

Phil