|
fotoboek
dit is een fotoboek
je bent wel een transparant.gif nodig
die kun je hier downloaden:
[download]http://users.skynet.be/javascript/pics/transparent.gif[/download]
<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","#",
"../pics/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="http://users.skynet.be/javascript/pics/transparent.gif" width="220" height="120">
</div>
</center>
download het script
Zie hier een demo van het script
Reacties van leden
|
