Javascript Diashow mit Popup-Fenster nach Mausklick
Johan Kier
- javascript
0 Micha
Hallo Forum,
ich habe eine kleine Diashow als Bildwechsel, das auch prima funktioniert.
<html>
<head>
<script language="JavaScript">
<!--
verzoegerung = 120;
bildNummer = 2;
bilder= new Array(); //nimmt die Bilder der Animation auf (ohne var weil global)
// hier werden die Bilder im Hintergrund geladen
for (i = 1; i <= 10; i++) {
bilder[i] = new Image();
bilder[i].src = "dp" + i + ".gif";// Natürlich müssen jetzt in dem gleichen Ordner 10 Bilder mit den Namen dp1.gif bis dp10.gif liegen.
}
function naechstesBild() {
document.animation.src = bilder[bildNummer].src;
bildNummer++;
if (bildNummer > 10) bildNummer = 1;
}
// -->
</script>
</head>
<body>
<img src="dp1.gif" name="animation" width="165" height="185" onLoad="setTimeout('naechstesBild()', verzoegerung)">
</body>
</html>
Nun möchte ich, dass nach einem Mausklick auf ein Bild ein neues HTML-FENSTER erscheint.
Hat jemand ein Skript zur Hand?
Vielen Dank vorab!
VG,
Johan
Hallo Johan Kier,
ich habe eine kleine Diashow als Bildwechsel, das auch prima funktioniert.
dieser hat jedoch ein paar kleine Formfehler:
<script language="JavaScript">
Hier solltest Du das type-Attribut hinzufügen. Auf das language-Attribut kannst Du hingegen verzichten.
Variablen, die in keiner Methode (in keinem Objekt) deklariert werden und somit dem Objekt window gehören, sind global. Aus diesem Grund darfst Du Deinen Globalvariablen auch ein var spendieren. Grundsätzlich gilt, dass Du so wenig wie möglich auf die globale Deklaration zurückgreifst und versucht, es lokal zu lösen. Dies vermeidet zB Konflikte mit anderen Skripten.
Statt:
verzoegerung = 120;
also lieber var verzoegerung = 120;
- für die anderen analog.
// hier werden die Bilder im Hintergrund geladen
for (i = 1; i <= 10; i++) {
Die Variable i ist nur ein Laufindex, der nicht global benötigt wird. Hier stört ein var sicher nicht. Dadruch wäre i nur in der Schleife bekannt und nach Abarbeitung dieser, kann sie aus dem Speicher entfernt werden.
bilder[i] = new Image();
In der Schleife kannst Du den Bildern auch das gewünschte Ereignis anfügen zB so:
bilder[i].onclick = function(e) { oeffneFenster(); };
In der Funktion offneFenster() kannst Du nun ein normales PopUp mit der gewünschten Seite öffnen.
Mit freundlichem Gruß
Micha