Hallo hallo!
Ich erarbeite gerade eine Bildergallerie mit vorwärts/rückwärts Buttons. Hab auch alles soweit, javascript und so, nur was mir noch Probleme bereitet ist das preloaden der Bilder, da ich bis zu 25 Bilder pro Galerie habe (600x350px).. ich hab jetzt ein solches Script

var myImages = new Array();
myImages[1] = new Image();
myImages[1].src = "pics/innenarchitektur.jpg";
myImages[2] = new Image();
myImages[2].src = "pics/3_2_1.jpg";
myImages[3] = new Image();
myImages[3].src = "pics/3_2_2.jpg";
myImages[4] = new Image();
myImages[4].src = "pics/3_2_3.jpg";
myImages[5] = new Image();
myImages[5].src = "pics/3_2_4.jpg";
myImages[6] = new Image();
myImages[6].src = "pics/3_2_5.jpg";
myImages[7] = new Image();
myImages[7].src = "pics/3_2_6.jpg";
myImages[8] = new Image();
myImages[8].src = "pics/3_2_7.jpg";
myImages[9] = new Image();
myImages[9].src = "pics/3_2_8.jpg";
myImages[10] = new Image();
myImages[10].src = "pics/3_2_9.jpg";
myImages[11] = new Image();
myImages[11].src = "pics/3_2_10.jpg";
myImages[12] = new Image();
myImages[12].src = "pics/3_2_11.jpg";
myImages[13] = new Image();
myImages[13].src = "pics/3_2_12.jpg";
myImages[14] = new Image();
myImages[14].src = "pics/3_2_13.jpg";
myImages[15] = new Image();
myImages[15].src = "pics/3_2_14.jpg";
myImages[16] = new Image();
myImages[16].src = "pics/3_2_15.jpg";


var myImages = new Array();
myImages[1] = { 'src' : 'pics/innenarchitektur.jpg',
'dsc' : '     ' };

myImages[2] = { 'src' : 'pics/3_2_1.jpg',
'dsc' : 'Glas Trösch, Gastrobereich' };

myImages[3] = { 'src' : 'pics/3_2_2.jpg',
'dsc' : 'Glas Trösch, Showroom Interieur' };

myImages[4] = { 'src' : 'pics/3_2_3.jpg',
'dsc' : 'Glas Trösch, Showroom Interieur Box «Public & Activity»' };

myImages[5] = { 'src' : 'pics/3_2_4.jpg',
'dsc' : 'Glas Trösch, Showroom Boxenkonzept' };

myImages[6] = { 'src' : 'pics/3_2_5.jpg',
'dsc' : 'Glas Trösch, Showoom Interieur Ausstellung Gastro & Hotel' };

myImages[7] = { 'src' : 'pics/3_2_6.jpg',
'dsc' : 'Glas Trösch, Showroom Interieur Gastro & Hotel' };

myImages[8] = { 'src' : 'pics/3_2_7.jpg',
'dsc' : 'Century Times Gems, Messestand' };

myImages[9] = { 'src' : 'pics/3_2_8.jpg',
'dsc' : 'Bodenschatz, Messestand Swissbau 05' };

myImages[10] = { 'src' : 'pics/3_2_9.jpg',
'dsc' : 'Bodenschatz, Messestand Swissbau 05' };

myImages[11] = { 'src' : 'pics/3_2_10.jpg',
'dsc' : 'Bodenschatz, Messestand Swissbau 05' };

myImages[12] = { 'src' : 'pics/3_2_11.jpg',
'dsc' : 'Bodenschatz, Messestand Swissbau 07' };

myImages[13] = { 'src' : 'pics/3_2_12.jpg',
'dsc' : 'Bodenschatz, Messestand Swissbau 07, Armaturenprogramm' };

myImages[14] = { 'src' : 'pics/3_2_13.jpg',
'dsc' : 'Bodenschatz, Messestand Swissbau 07, Innenbereich mit Gesamtprogramm' };

myImages[15] = { 'src' : 'pics/3_2_14.jpg',
'dsc' : 'Bodenschatz, Messestand Swissbau 07, Durchblick von der Bar' };

myImages[16] = { 'src' : 'pics/3_2_15.jpg',
'dsc' : 'SH-Holz Biel, Gastromöblierung' };



var maxValue = myImages.length - 1;
var intValue = 1;
function gallerie(charValue) {
if(charValue == 'c') {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[intValue].src + "'><p>" + myImages[intValue].dsc + "</p>";
}
else if(charValue == '+') {
if(intValue == maxValue) {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[1].src + "'><p>" + myImages[1].dsc + "</p>";
intValue = 1;
}
else {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[intValue + 1].src + "'><p>" + myImages[intValue + 1].dsc + "</p>";
intValue = intValue + 1;
}
}
else if(charValue == '-') {
if(intValue == 1) {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[maxValue].src + "'><p>" + myImages[maxValue].dsc + "</p>";
intValue = maxValue;
}
else {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[intValue - 1].src + "'><p>" + myImages[intValue - 1].dsc + "</p>";
intValue = intValue - 1;
}
}
}

function vorladen1(i) {
if (! myImages[i].img ) {
myImages[i].img = new Image();
myImages[i].img.src = myImages[i].src;
}
}

function vorladen(i) {
var next= i<(maxValue-1) ? (i+1) : 1;
var prev= i>1 ? (i-1) : 1;
vorladen1(next);
vorladen1(prev);
}

</script>

<div id="logo"></div>


<body onLoad="gallerie('c')">

<div id="imgGallerie"></div>
<div id="links"><a href="#" onClick="gallerie('-')"><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#420032"><</font></a></div>
<div id="rechts"><a href="#" onClick="gallerie('+')"><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#420032">></font></a></div>

</body>

Die Preload Funktion funktioniert zwar, die Seiten laden halt bissl länger gesamthaft, doch wenn man dann mal in der Galerie vor und zurück geht, dann laden die Bilder wieder.

Ich wurde schon auf eine sogenannte "Image-Funktion" hingewiesen, wo ich aber nicht wiess, wie ich die in meinem Array anwenden kann.

Was mich auch noch interessieren würde wäre, ob eine Möglichkeit der Verbindung von zählen/Galerie besteht? Hab schon überall gesucht, doch nichts brauchbares gefunden...



liebe Grüsse
Sarah