<body onload="fotoboek()">
<script language="JavaScript" type="text/javascript">
// dit kun je wijzigen
 var Beeldbreedte=116;
 var Beeldhoogte=118;
 var Rand=true;
 var Randkleur="silver";
 var Snelheid=15;
 var Pauze=1500; // 1 seconde = 1000
 var Verticaal=0; 
// hier plaats je de afbeeldingen
 Afbeeldingen=new Array(
  "foto1.jpg","#",
  "foto2.jpg","#",
  "foto3.jpg","#",
  "foto4.jpg","#" // geen komma na laatste regel!
  );
// Hieronder niets wijzigen
 var BLI,BMI,BRI,BTI,HOEK=0,AFBC=6,MAXB,RICHTING=1;
 var B_MSz,HALT=false;AFBV=new Array(Afbeeldingen.length);

 function fotoboek(){
  if(document.getElementById){
   for(i=0;i<Afbeeldingen.length;i+=2){
    AFBV[i]=new Image();AFBV[i].src=Afbeeldingen[i]}
   BoekDiv=document.getElementById("Boek");
   BLI=document.createElement("img");BoekDiv.appendChild(BLI); 
   BRI=document.createElement("img");BoekDiv.appendChild(BRI);
   BMI=document.createElement("img");BoekDiv.appendChild(BMI); 
   BLI.style.position=BMI.style.position=BRI.style.position="absolute";
   BLI.style.zIndex=BRI.style.zIndex=0;BMI.style.zIndex=1;
   BLI.style.top=(Verticaal?Beeldhoogte+1:0)+"px";
   BLI.style.left=0+"px";
   BMI.style.top=0+"px";
   BMI.style.left=(Verticaal?0:Beeldbreedte+1)+"px";
   BRI.style.top=0+"px";
   BRI.style.left=(Verticaal?0:Beeldbreedte+1)+"px";
   BLI.style.height=Beeldhoogte+"px";
   BMI.style.height=Beeldhoogte+"px";
   BRI.style.height=Beeldhoogte+"px";
   BLI.style.width=Beeldbreedte+"px";
   BMI.style.width=Beeldbreedte+"px";
   BRI.style.width=Beeldbreedte+"px";
   if(Rand){
    BLI.style.borderStyle=BMI.style.borderStyle=BRI.style.borderStyle="solid";
    BLI.style.borderWidth=1+"px";
    BMI.style.borderWidth=1+"px";
    BRI.style.borderWidth=1+"px";
    BLI.style.borderColor=BMI.style.borderColor=BRI.style.borderColor=Randkleur}
   BLI.src=AFBV[0].src;
   BLI.lnk=Afbeeldingen[1];
   BMI.src=AFBV[2].src;
   BMI.lnk=Afbeeldingen[3];
   BRI.src=AFBV[4].src;
   BRI.lnk=Afbeeldingen[5];
   BLI.onclick=BMI.onclick=BRI.onclick=HYPERLINK;
   BLI.onmouseover=BMI.onmouseover=BRI.onmouseover=STOP;
   BLI.onmouseout=BMI.onmouseout=BRI.onmouseout=START;
   AFBEELDINGEN()}}

 function AFBEELDINGEN(){
  if(!HALT){
   if(Verticaal){
    B_MSz=Math.abs(Math.round(Math.cos(HOEK)*Beeldhoogte));
    MidOffset=!RICHTING?Beeldhoogte+1:Beeldhoogte-B_MSz;
    BMI.style.top=MidOffset+"px";
    BMI.style.height=B_MSz+"px"}
   else{B_MSz=Math.abs(Math.round(Math.cos(HOEK)*Beeldbreedte));
    MidOffset=RICHTING?Beeldbreedte+1:Beeldbreedte-B_MSz;
    BMI.style.left=MidOffset+"px";
    BMI.style.width=B_MSz+"px"}
   HOEK+=Snelheid/720*Math.PI;
   if(HOEK>=Math.PI/2&&RICHTING){
    RICHTING=0;
    if(AFBC==Afbeeldingen.length)AFBC=0;
    BMI.src=AFBV[AFBC].src;
    BMI.lnk=Afbeeldingen[AFBC+1];
    AFBC+=2}
   if(HOEK>=Math.PI){
    RICHTING=1;
    BTI=BLI;
    BLI=BMI;
    BMI=BTI;
    if(Verticaal)BMI.style.top=0+"px";
    else BMI.style.left=Beeldbreedte+1+"px";   
    BMI.src=BRI.src;
    BMI.lnk=BRI.lnk;

    setTimeout("PAUZEREN()",Pauze)}
   else setTimeout("AFBEELDINGEN()",50)}
  else setTimeout("AFBEELDINGEN()",50)}

 function PAUZEREN(){
   if(AFBC==Afbeeldingen.length)AFBC=0;
   BRI.src=AFBV[AFBC].src;
   BRI.lnk=Afbeeldingen[AFBC+1];
   BMI.style.zIndex=2;
   BLI.style.zIndex=1;
   HOEK=0;
   AFBC+=2;
  setTimeout("AFBEELDINGEN()",50)}

 function HYPERLINK(){if(this.lnk)window.location.href=this.lnk}
 function STOP(){HALT=true;this.style.cursor=this.lnk?"pointer":"default"}
 function START(){HALT=false}
</script>
<center>
 <div id="Boek" style="position:relative">
  <img src="transparant.gif" width="220" height="120">
 </div>
</center>