• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

imgArray - bitte um Verbesserungsvorschläge

Status
Für weitere Antworten geschlossen.
B

Bernhard

Neues Mitglied
Hallo @ alle,

nachdem ich an meiner Bildergalerie immer noch total verzweifle, :sad:
hab ich mich mal an was einfacherem versucht:
Code: 
var imgArray = new Array();
imgArray[0] = "../img/bild-1.gif";
imgArray[1] = "../img/bild-2.gif";
imgArray[2] = "../img/bild-3.gif";

function BilderLaden() {
	for (i=0; i < imgArray.length; i++) {
		var img = new Image();
		img.src = imgArray[i];
		}
	}
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<script src="includes/bilder.js" type="text/javascript"></script>
</head>

<body onload="BilderLaden()">
<img src="img/landkarte.gif" alt="" width="200" height="300" usemap="#landkarte-Map" id="karte" />
<map name="landkarte-Map" id="landkarte-Map">
	<area shape="poly" alt="" title="" coords="" href="#" target="_blank" onmouseover="document.getElementById('karte').src='img/bild-1.gif';" onmouseout="document.getElementById('karte').src='img/landkarte.gif';" />
	<area shape="poly" alt="" title="" coords="" href="#" target="_blank" onmouseover="document.getElementById('karte').src='img/bild-2.gif';" onmouseout="document.getElementById('karte').src='img/landkarte.gif';" />
	<area shape="poly" alt="" title="" coords="" href="#" target="_blank" onmouseover="document.getElementById('karte').src='img/bild-3.gif';" onmouseout="document.getElementById('karte').src='img/landkarte.gif';" />
</map>
</body>
</html>
Das funktioniert soweit auch, mich interessiert aber, ob man da irgendwas besser machen könnte...
Außerdem müsste die Variable i doch m.E. irgendwo definiert werden, aber wo?
Und welchen Wert muss sie haben?

Grüße
Bernhard
 
Junny schrieb:
Die Variable i wird in der Klammer von for erstmals erwähnt und hat den Ausgangswert 0.
Code: 
// ...
    for (i=0; i < imgArray.length; i++) {
// ...
SELFHTML: JavaScript / Sprachelemente / Schleifen (while/for/do-while)

Die Events würde ich nicht in den HTML-Quelltext schreiben, sondern per Javascript hinzufügen.

Gruß
Junny
Zum Vergrößern anklicken....

Hallo Junny,

danke für Deine Antwort! Die JavaScript-Konsole gibt mir eine Warnung aus:
Warnung: assignment to undeclared variable i
Quelldatei: http://www.(...).de/includes/bilder.js
Zeile: 7
Zum Vergrößern anklicken....
Hinzufügen der Events per JavaScript müsste dann in etwa so aussehen?
Code: 
onmouseover="BildWechsel(1)" onmouseout="BildWechsel(0)"

analog natürlich für die anderen areas...
Code: 
function BildWechsel(0) {
    document.getElementById('karte').src='../img/landkarte.gif';
    }
function BildWechsel(1) {
    document.getElementById('karte').src='../img/bild-1.gif';
    }
function BildWechsel(2) {
    document.getElementById('karte').src='../img/bild-2.gif';
    }
function BildWechsel(3) {
    document.getElementById('karte').src='../img/bild-3.gif';
    }
hab's noch nicht getestet, denke aber, dass das der richtige Weg sein könnte?

Könnte man das kürzer schreiben? Ich könnte mir vorstellen, dass man die
fortlaufenden Nummern durch eine Variable ersetzen könnte?

Könnte man das Array einfacher erstellen? Da stell ich mir sowas in der Art
vor, dass ich mittels PHP schaue, wieviele Bilder in dem Bilderordner sind,
diese Anzahl an JavaScript weitergebe und mit einer for-Schleife das Array
erstelle, bis die Bildnummer gleich der Anzahl ist?

Grüße
Bernhard
 
Warnung: assignment to undeclared variable i
Zum Vergrößern anklicken....
Code: 
var i = 0
--------------------------------------------------------------------------------

Nein, das mit den Funktionen wird nicht funktionieren, weil über den Parameter keinerlei Unterscheidung möglich ist. Die Funktion BildWechsel wird also ständig neu definiert.
Schreibe eine Funktion in welcher du dein Array benutzt.

Wenn du in PHP ein Array hast:
PHP: 
$bilder = array(
    'bild1.jpg',
    'bild2.jpg',
    'bild3.jpg',
);
Kannst du dich json_encodes bedienen:
PHP: 
print 'var imgArray = ' . json_encode($bilder) . ';'
 
crash schrieb:
Code: 
var i = 0
Zum Vergrößern anklicken....

Hallo crash,

danke! Funktioniert! Wobei ich annehme, dass hinter var i = 0 ein Semikolon gehört?
Hab jedenfalls eins gemacht und es nicht ohne getestet...

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

crash schrieb:
Nein, das mit den Funktionen wird nicht funktionieren, weil über den Parameter keinerlei Unterscheidung möglich ist. Die Funktion BildWechsel wird also ständig neu definiert.
Schreibe eine Funktion in welcher du dein Array benutzt.

Wenn du in PHP ein Array hast:
PHP: 
$bilder = array(
    'bild1.jpg',
    'bild2.jpg',
    'bild3.jpg',
);
Kannst du dich json_encodes bedienen:
PHP: 
print 'var imgArray = ' . json_encode($bilder) . ';'
Zum Vergrößern anklicken....

O.K. da werd ich mich drum kümmern, sobald ich es irgendwie geschafft habe, die Sch...-Bildergalerie zum Laufen zu bringen...

Grüße
Bernhard
 
Bernhard schrieb:
Hallo crash,

danke! Funktioniert! Wobei ich annehme, dass hinter var i = 0 ein Semikolon gehört?
Hab jedenfalls eins gemacht und es nicht ohne getestet...
Zum Vergrößern anklicken....
Semikolons sind optional, sofern die Befehle durch einen Umbruch getrennt sind. Generell wird empfohlen sie zu setzen. In der for muss es sogar passieren.
 
crash schrieb:
Semikolons sind optional, sofern die Befehle durch einen Umbruch getrennt sind. Generell wird empfohlen sie zu setzen. In der for muss es sogar passieren.
Zum Vergrößern anklicken....


Hallo Crash,

danke! Dann muss ich zumindest bei den Semikolons meine
(geringen) Kenntnisse nicht über den Haufen werfen und
werde sie so weiterverwenden, wie ich es kenne...

Bleibt das Problem mit meiner Galerie :-(

Grüße
Bernhard
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben