Chräcker Heller: Rollover Effekt mit Bildern

Beitrag lesen

Hallo,

im Gegensatz zu Cheatah (zu schnell geschossen?) habe ich Dein Vorgehen so verstanden, daß du das Bild austauschst, ohne es vorgeladen zu haben. Das passiert zum Bsp auch dann, wenn man die Austauschroutiene direkt in den a-Tag einbaut, so wie es idiotischerweise PaintshopPro macht.

Das Geheimnis ist, die Bilder beim laden der Seite vor zu laden. dadurch stehen die im Cache und sind beim auslösen des mouseover-Effektes sofort da. Ich selber benutze immer folgende Standart-Routine. (Achtung, funktioniert so nicht bei Bildern innerhalb von Divs mit dem NS, da muß die Routiene noch erweitert werden....)

Oben im Head:

<SCRIPT LANGUAGE="JavaScript">
<!--
aus_eins = new Image();
aus_eins.src = "schalter_aus.gif";
an_eins = new Image();
an_eins.src = "schalter_an.gif";

function Bildwechsel(Bildname,Bildobjekt)
{
 window.document.images[Bildname].src = Bildobjekt.src;
}

//-->
</script>

und die dazugehörende a-Tag-Zeile:

<A HREF="naechste_seite.html"
onMouseOver="Bildwechsel('schalterbild_eins',an_eins)"
onMouseOut="Bildwechsel('schalterbild_eins',an_aus)">
<img name="schalter_eins" src="schalter_an.gif" width="34" height="34" border="0" alt=""></a>

Wenn Du (sehr wahrscheinlich ;-) ) mehr mouseoverflächen hast, dann must Du eben die jeweiligen "Bildersets" (bestehend aus den beiden Bildern) wie oben geschrieben dazu vorladen. Also meinentwegen:

aus_zwei = new Image();
aus_zwei.src = "schalter_zwei_aus.gif";
an_zwei = new Image();
an_zwei.src = "schalter_zwei_an.gif";

etc..... einfach am Anfang untereinander weg schreiben....

Es ist im Prinzip die Routine, die auch in SELFHTML steht, nur daß hier das image-Tag einen namen bekommt (wichtig) und dieser name der Austauschroutiene übergeben wird.

Chräcker

http://www.Stempelgeheimnis.de