Felix Riesterer: Bildwechsel

Beitrag lesen

Lieber muller,

Du hast offensichtlich den Bilderwechsel mit JavaScript gelöst. Das bedeutet, dass Du eigentlich im Themenbereich "JavaScript" posten solltest.

<title>???</title>

Hehehe.

<script type="text/javascript">
LogoOut = new Image();
LogoOut.src = "img/Logo_300_139.png";
LogoOver = new Image();
LogoOver.src = "img/Logo_WC3_300_139.png";

HomeOut = new Image();
HomeOut.src = "img/Home_139_27.png";
HomeOver = new Image();
HomeOver.src = "img/HomeAktiv_139_27.png";

function Bildwechsel (Bildnr, Bildobjekt)
{
   window.document.images[Bildnr].src = Bildobjekt;
}
</script>

Das ist also der relevante Code. Du definierst drei globale Variablen ("LogoOut", "HomeOut" und "Bildwechsel"). Dass Dein Funktionsobjekt ("Bildwechsel") global ist, ist OK, aber die beiden Bildobjekte hätte ich lieber irgendwo versteckt... aber das nur am Rande.

Dieses JavaScript legt nun zwei Bildobjekte an, wahrscheinlich um die benötigten Bilddateien vom Browser schoneinmal vorladen zu lassen, damit beim Hovern die Bilder sofort verfügbar sind. Soweit ist das so in Ordnung.

<a href="Index.html"
   onmouseover="Bildwechsel(0, LogoOver.src)"
   onmouseout="Bildwechsel(0, LogoOut.src)">
   <img class="Logo" src="img\Logo_300_139.png"
        alt="???"></a>

Aha, hier ist ein Bild als anklickbarer Link definiert worden. Um diesen Link beim Überfahren mit der Maus zu verändern, benutzt Du JavaScript. Das geht auch anders! Da Du CSS ja bereits einsetzt, sollte Dir eine reine CSS-Lösung recht bald gelingen. Gerade was Links angeht, sollte auch der Internet Explorer in der Version 6 ausreichend mitspielen, sodass Du völlig ohne JavaScript auskommen solltest.

Merke: Backslashes sind nur unter Windows als Trennzeichen zwischen Verzeichnis- und Dateinamen sinnvoll. Da eine Website aber in aller Regel auf nicht-Windows-Systemen bereitgestellt wird, werden Deine Pfadangaben (zumindest in "echten" Browsern, also nicht IE) zu Problemen führen!

Zu Deinem eigentlichen JavaScript-Problem:

window.document.images[Bildnr].src = Bildobjekt;

Du referenzierst das zu ändernde Bild über seine "laufende Nummer", wobei Du von den Bildelementen im <body>-Element ausgehst und dort mit 0 zu zählen beginnst. Ich könnte mir vorstellen, dass nach der JavaScript-Anweisung, die Deine beiden Bildobjekte definiert, diese Zählung etwas durcheinander kommt. Das läge dann aber an Deiner momentanen Herangehensweise...

Liebe Grüße,

Felix Riesterer.

--
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)