scherzkeks: 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!

Vielleicht cachet dein Mozilla, der IE aber nicht.
Oder du hast beim Entwickeln mit Mozilla gearbeitet, sodass da sowieso vorgecachet wurde.
Wieso verwendest du fuer jeden Button eigene Bilder und benutzt nicht ein Hintergrundbild, das sich beim Hovern austauscht und schreibst den Text bzw benutzt fuer ihn ein transparentes gif?

hier ist der Code:[...]


basis.css

[...]


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 LL(ele) {
ele.className = "LL2";
ele.style.cursor = "Pointer";
}
function LL2(ele) {
ele.className = "LL";
ele.style.cursor = "default";
}

Das koenntestdu dir echteinfacher machen!
Etwas universeller sind Scripts grundsaetzlich besser.
Uebergebe doch einer universellen Funktion auch den className.
Oder machs so, wie vorgeschlagen:
Bsp:
HTML:

  
<a class="navibutton" href="index.php" onMouseOver="void(this.className = 'gehovert')" onMouseOut="void(this.className = 'ungehovert')">Startseite</a>  
<a class="navibutton" href="ma.php" onMouseOver="void(this.className = 'gehovert')" onMouseOut="void(this.className = 'ungehovert')">musik &amp; artists</a>  
<a class="navibutton" href="mu.php" onMouseOver="void(this.className = 'gehovert')" onMouseOut="void(this.className = 'ungehovert')">musik uploaden</a>  
<a class="navibutton" href="sonst.php" onMouseOver="void(this.className = 'gehovert')" onMouseOut="void(this.className = 'ungehovert')">Sonstiges</a>  
<a class="navibutton" href="links.php" onMouseOver="void(this.className = 'gehovert')" onMouseOut="void(this.className = 'ungehovert')">Links</a>  
<a class="navibutton" href="forum.php" onMouseOver="void(this.className = 'gehovert')" onMouseOut="void(this.className = 'ungehovert')">Forum</a>  
<a class="navibutton" href="kontakt.php" onMouseOver="void(this.className = 'gehovert')" onMouseOut="void(this.className = 'ungehovert')">Kontakt</a>  

CSS:

  
.ungehovert { background-image:url(img/buttons/ungehovert.png); color:yellow; }  
.gehovert { background-image:url(img/buttons/gehovert.png); color:brown; }  

Da sind sicher noch ne Menge Fehler drinne, aber wenn sie jemand findet (ich find bestimmt auch noch selbst was), wird ers wohl sagen.

Das ist natuerlich nur ein Beispiel und nicht getestet oder so.

Das wars !

Ich hoffe ihr könnt mir helfen!

Ich auch ^^

MFG

einen schoenen Montachnachmittach MNVFG noch,
scherzkeks

Phil