java script en foto

luuk2512 · 14 jan 2011

Hallo,
Ik heb een java script gedownload voor een fotoalbum, dit werkt echter niet helemaal zoals het hoort. Ik heb een stuk of 12 foto's erin gezet maar hij laat er maar 8 zien.
Kan iemand in de bron van de pagina kijken waar de fout zit?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Fotoalbum Camping 't Boerenland</title>
<style type="text/css">

</style></head>

<body onload="fotoboek()">
<center>
<script language="JavaScript" type="text/javascript">
// hieronder de variabelen

var Beeldbreedte=300;//breedte
var Beeldhoogte=200;//hoogte
var Rand=true;//wel of geen rand ( false or true )
var Randkleur="#404040";//kleur rand
var Snelheid=15;//snelheid
var Pauze=2500; // 1 seconde = 1000
var Verticaal=0;//horizontaal of vertikaal fotoboek ( 1 of 0 )

// plaats hieronder je afbeeldingen iedere foto is apart zelfs aan een link te koppelen

Afbeeldingen=new Array(
"foto/Camping.jpg",
"foto/tn_maart tm okt. 2010 062.jpg",
"foto/tn_maart tm okt. 2010 056.jpg",
"foto/tn_maart tm okt. 2010 072.jpg",
"foto/tn_PICT0803.JPG",
"foto/tn_PICT0804.JPG",
"foto/tn_camping 2007 0171.jpg",
"foto/tn_folder 2007 deel2 015.jpg",
"foto/tn_folder 2007 012.jpg",
"foto/tn_folder 2007 013.jpg",
"foto/tn_folder 2007 018.jpg",
"foto/tn_maart tm okt. 2010 077.jpg"
);
// Hieronder niets meer 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=new Image();AFBV.src=Afbeeldingen}
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.src=AFBV[6].src;
BLI.lnk=Afbeeldingen[7];
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="300" height="200">
</div>
</center>
</body>
</html>

silkcom · 14 jan 2011

De fout zit in het begin bij het vullen van de tweede array met foto`s en ook bij het "ombladeren".
Ik heb de juiste code hierbij toegevoegd:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Fotoalbum Camping 't Boerenland</title>
<style type="text/css">
<!--
body {
background-color: #FFFFCC;
}
-->
</style></head>

<body onload="fotoboek();">
<center> 
<script language="JavaScript" type="text/javascript">
// hieronder de variabelen

var Beeldbreedte=400;//breedte
var Beeldhoogte=300;//hoogte
var Rand=false;//wel of geen rand ( false or true )
var Randkleur="#404040";//kleur rand
var Snelheid=15;//snelheid
var Pauze=2500; // 1 seconde = 1000
var Verticaal=0;//horizontaal of vertikaal fotoboek ( 1 of 0 )

// plaats hieronder je afbeeldingen iedere foto is apart zelfs aan een link te koppelen

Afbeeldingen=new Array(
 "foto/Camping.jpg", 
 "foto/tn_maart tm okt. 2010 062.jpg",
 "foto/tn_maart tm okt. 2010 056.jpg",
 "foto/tn_maart tm okt. 2010 072.jpg",
 "foto/tn_PICT0803.JPG",
 "foto/tn_PICT0804.JPG", 
 "foto/tn_camping 2007 0171.jpg",
 "foto/tn_folder 2007 deel2 015.jpg",
 "foto/tn_folder 2007 012.jpg",
 "foto/tn_folder 2007 013.jpg",
 "foto/tn_folder 2007 018.jpg",
 "foto/tn_maart tm okt. 2010 077.jpg" 
);

// Hieronder niets meer 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+=1){                                               // Dit was 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.src=AFBV[6].src;
  BLI.lnk=Afbeeldingen[7];
  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+=1;                                                  // Dit was 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+=1;                                                  // Dit was 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">
</div>
<br />
</center>
</body>
</html>

phobia · 14 jan 2011

zorg ook dat je geen spaties in je bestandsnamen hebt zitten!

dus niet img 2006 okt tm sept.jpg

maar img_2006_okt_tm_sept.jpg

servers willen daar nog al eens problemen mee hebben

luuk2512 · 14 jan 2011

Bedankt mannen het werkt!!!
Volgende vraag: Waar kan ik in de bron van dit gebeuren tekst neerzetten die ook op de site te lezen is?

java script en foto

luuk2512

Verenigingslid

silkcom

Gebruiker

phobia

Terugkerende gebruiker

luuk2512

Verenigingslid

Nieuwste berichten

Wij waarderen jouw privacy