Joe: Bildergalerie selbst gestalten und erstellen

Beitrag lesen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
 <title>Unbenannt</title>
 <script>
  var myImages = new Array();
  myImages[1] = new Image();
  myImages[1].src = "1.jpg";
  myImages[2] = new Image();
  myImages[2].src = "2.jpg";
  myImages[3] = new Image();
  myImages[3].src = "3.jpg";
  myImages[4] = new Image();
  myImages[4].src = "4.jpg";
  myImages[5] = new Image();
  myImages[5].src = "5.jpg";

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

</script>
</head>

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

<table border="1">
 <tr>
  <td><a href="#" onclick="gallerie('-')">Pfeil_links</a></td>
  <td><div id="imgGallerie"></div></td>
  <td><a href="#" onclick="gallerie('+')">Pfeil_rechts</a></td>
 </tr>
</table>

</body>
</html>

Bitte schön