Nico Matthiesen: Bilder Slideshow

Hallo,

ich bin nicht besonders fit im programmieren, daher möchte ich mir eine Beispielslideshow anpassen. Ich habe ca 700 Urlaubsbilder. Bis auf das Design ist diese Slideshow schon in etwa das, was ich haben wollte. Hier der Code:

--------
<html>
<head>
<title>Slideshow 10</title>

<script language="JavaScript"><!--

var Bilder = new Array("fotos/DSCF0001.jpg","fotos/DSCF0002.jpg","fotos/DSCF0003.jpg","fotos/DSCF0004.jpg","fotos/DSCF0005.jpg","fotos/DSCF0006.jpg");

var BildAnzahl = Bilder.length;
var number = 0;
var BildFolge = new Image(); BildFolge.src = Bilder[number];

function change(direction) {

number = number + direction;

if(number < 0) number = BildAnzahl -1;
else if(number > BildAnzahl -1 ) number = 0;

BildFolge.src = Bilder[number];
document.austausch.src = BildFolge.src;
}

//-->
</script>

<style type="text/css">
<!--

A:link { color : black;background-color:none; text-decoration: none ;}

A:visited {color : black;background-color:none; text-decoration: none ; }

A:active{color : black;background-color:none; text-decoration: none ; }

A:hover{background-color:white;color:black;text-decoration: none ;}
-->
</style>

</head>

<body bgcolor="#cccccc" >

<table bordercolordark="black"  align="center" border="1" cellpadding="10" cellspacing="10"   >
<tr>
 <td bgcolor="#666666" ><img src="fotos/DSCF0001.jpg" border="0" alt="" name="austausch"></td>
</tr>
</table>
<br>
<br>

<table align="center" border="1" >
<tr>
<td >
<a href="javascript:change(-1)">  < vorheriges Bild  </a></td>
<td>  </td>
<td>
<a href="javascript:change(1)">  nächstes Bild  >  </a>
</td></tr>
</table>

<br>

</body>
</html>

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

Nun ist das Problem, das ich ein Array angeben muss. Als Beispiel habe ich mal 6 Bilder in das Array eingefügt. Nun habe ich aber definitiv keine Lust 700 Bildernamen einzutickern. Ansich müsste es doch soetwas wie einen Zähler geben. Die Bilder sind doch echt Klasse vornummeriert.

Hat jemand einen Tip?

Vielen Dank

  1. Hallo Nico!

    Was du brauchst ist eine for-schleife. Damit liest du alle Bilder ein bis die Zahl 700 oder das Bild 700 erreicht ist.

    Gruß David!

    1. Hast Du mal ein ganz kurzes Beispiel, sagte ja, ich bin nicht wirklich fit.

  2. Hallo,

    ich bin nicht besonders fit im programmieren, daher möchte ich mir eine Beispielslideshow anpassen. Ich habe ca 700 Urlaubsbilder. Bis auf das Design ist diese Slideshow schon in etwa das, was ich haben wollte. Hier der Code:


    <html>
    <head>
    <title>Slideshow 10</title>

    <script language="JavaScript"><!--

    var Bilder = new Array("fotos/DSCF0001.jpg","fotos/DSCF0002.jpg","fotos/DSCF0003.jpg","fotos/DSCF0004.jpg","fotos/DSCF0005.jpg","fotos/DSCF0006.jpg");

    setBilder("fotos/DSCF", 1, 700);
    function setBilder(datei, von, bis)
    {
        for(var i = von;i < bis; i++)
        Bilder[Bilder.length] = datei + getNr(i) + '.jpg';
    }
    function getNr(nr, length)
    {
        var zahl = nr ? nr : counter;
        var l = length ? length : 4;
        zahl += '';
        for(var i = zahl.length; i < l; i++) zahl = '0' + zahl;
        return zahl;
    }

    Struppi.