JavaScripts -> Bilder -> Slideshow mit Preloader

<script type="text/javascript">
<!--
<!--
// = = ======================================================================= = =
// = = Arsenal Slide Show v1.0 (c) 2003 Triple-M / http://www.htmlarsenal.de = =
// = = ======================================================================= = =

// -------------------------------------------------------------------------------
// -- Dieses Script und viele andere im --
// -- This script and many more in the --
// -------------------------------------------------------------------------------
// -- HTML ARSENAL - Die Quelle für HTML, JavaScript, PHP --
// -- HTML ARSENAL - Your Source for HTML, JavaScript, PHP --
// -------------------------------------------------------------------------------
// -- -= http://www.htmlarsenal.de =- --
// -------------------------------------------------------------------------------

// Sie dürfen dieses Script für nicht-kommerzielle Zwecke nutzen, wenn diese Urheber-Notiz erhalten bleibt.
// You may use this Script for non-commercial causes as long as you include this copyright notice.

// Benutzung:
// ==========

// An der Stelle, an der die Slideshow zu sehen sein soll, schreiben Sie ein Script mit dem Inhalt
// slideshow();

// Usage:
// ======

// Include a script with the content
// slideshow();
// at the position where the slide show shall be placed.

// Veränderbare Einstellungen / Adjustable Settings
// ================================================

// Dateinamen der Bilder / file names of the images
// Es können beliebig viele Bilder hinzugefügt, verändert oder entfernt werden
// Any number of images may be added, changed or removed

var images=new Array(
  "/pics/examples/gallery01.jpg",
  "/pics/examples/gallery02.jpg",
  "/pics/examples/gallery03.jpg",
  "/pics/examples/gallery04.jpg",
  "/pics/examples/gallery05.jpg",
  "/pics/examples/gallery06.jpg",
  "/pics/examples/gallery07.jpg",
  "/pics/examples/gallery08.jpg",
  "/pics/examples/gallery09.jpg",
  "/pics/examples/gallery10.jpg"
);

var imgw=400; // Breite der Bilder / width of the images
var imgh=300; // Höhe der Bilder / height of the images

var auto=5000; // Automatischer Vorlauf. 0 entspricht keinem Vorlauf, jede andere Zahl entspricht der Länge der Pause in Millisekunden.
               // Automatic mode. 0 means no automatic mode, every other number means length of the break in milliseconds

// Script-Code
// ===========

// Ab hier bitte nichts mehr verändern
// Please do not change anything from here on

var asrun=0;

var imgx=new Array();

function plcheck(pimage) {
  if(imgx[pimage].complete) {
    pimage++;
    if(pimage<images.length) {
      preloader(pimage);
      document.getElementById("cache").firstChild.nodeValue=" ("+(parseInt((pimage*100)/images.length))+"% vorgeladen)";
    } else document.getElementById("cache").firstChild.nodeValue="";

  } else {
    window.setTimeout("plcheck("+pimage+")",500);
  }
}

function preloader(image) {
  imgx[image]=new Image;
  imgx[image].src=images[image];
  window.setTimeout("plcheck("+image+")",500);
}

function asnext() {
  co=cur;
  cur++;
  if(cur>=images.length) cur=0;
  if(imgx[cur] && imgx[cur].complete)document.asp.src=imgx[cur].src;
  else cur=co;
  document.getElementById("info").firstChild.nodeValue="Bild "+(cur+1)+"/"+images.length+(asrun?" (Autovorlauf)":"");
}

function aslast() {
  co=cur;
  cur--;
  if(cur<0)cur=images.length-1;
  if(imgx[cur] && imgx[cur].complete)document.asp.src=imgx[cur].src;
  else cur=co;
  document.getElementById("info").firstChild.nodeValue="Bild "+(cur+1)+"/"+images.length+(asrun?" (Autovorlauf)":"");
}

function aspause() {
  asrun=1-asrun;
  document.getElementById("info").firstChild.nodeValue="Bild "+(cur+1)+"/"+images.length+(asrun?" (Autovorlauf)":"");
}

function asauto() {
  if(asrun)asnext();
}


function slideshow() {
  document.write('<img name="asp" src="'+images[0]+'" width="'+imgw+'" height="'+imgh+'" alt="Arsenal Slide">');
  if(auto)asrun=1;
  document.write('<br /><span id="info"> Bild 1/'+images.length+(asrun?" (Autovorlauf)":"")+'</span><br /><span style="font-size:80%" id="cache"> (0% vorgeladen)</span>');
  document.write('<br /><a style="cursor:pointer" onClick="aslast()">[ &lt;&lt; ]</a> ');
  if(auto) document.write('<a style="cursor:pointer" onClick="aspause()">[ &gt;II ]</a> ');
  document.write('<a style="cursor:pointer" onClick="asnext()">[ &gt;&gt; ]</a><br />');
  cur=0;
  preloader(0);

  if(auto)window.setInterval("asauto()",auto);
}

// ----------------------------
// -- Ende / End Script-Code --
// ----------------------------
// -- Arsenal Slide Show --
// -- Author: Triple-M --
// -- www.htmlarsenal.de --
// -- 09.Nov.2003 --
// ----------------------------

//-->
</script>