nicht angemeldet
Hallo, zum Test bitte die Bilder abspeichern und relativ adressieren, da sonst ggf. der cache nicht funktioniert und die Darstellung zu langsma wird, z.B. ./buttton6.jpg
Aufrufe mit onload="jalousie" oder onload="test()" bitte auch probieren.
Suche weitere Möglichkeiten, Algorithmen, z.B. für Dreieck oder andere Effekte.
Opera geht leider nicht und ich wüsste gerne warum (Verbeserungsvorschlag ?).
THX :)
Hier der Code:
<!doctype html public "-//W3C//DTD HTML 4.0 //EN"> <html> <head> <meta name="author" content="MichelM"> <meta name="generator" content="Ulli Meybohms HTML EDITOR"> <title></title> <script type="text/javascript" language="JavaScript"><!--
var Bilder=new Array(); var tempr=new Array(); var temps=new Array(); var bildanz=4;var j=0; /*hier die maximale Anzahl der Bilder eingeben */ for(i=1;i<=bildanz;i++){Bilder[i]=new Image();}
Bilder[1].src="http://iaweb.org/images/button6.jpg"; Bilder[2].src="http://iaweb.org/images/button1.jpg"; Bilder[3].src="http://iaweb.org/images/button4.jpg"; Bilder[4].src="http://iaweb.org/images/button5.jpg";
var wechsel=3;var reihen=1;var spalten=0;counter=0;max_wechsel=200; var ende=false; var rhe=false; var pause=false;
function test() { spalten++; if (spalten>5){spalten=1;reihen++;ende=true;} if(reihen>5){reihen=1;rhe=true;} if(wechsel>bildanz){wechsel=1;} document.getElementById("r"+reihen+"s"+spalten).src=Bilder[wechsel].src; if(ende==true&&rhe==true){if (wechsel<=bildanz){wechsel++;pause=true;ende=false;rhe=false;reihen=1;max_wechsel--;} } if(max_wechsel>=1){ if(pause==false){mm_dummytime=setTimeout("test()",25);}//Zeiteinstellung für Effekt else {mm_dummytime=setTimeout("test()",3000);pause=false;}} //Zeit für Bilderwechsel }//ef
function jalousie(){ counter++; for(reihen=1;reihen<=5;reihen++){
if(counter>=5){spalten++;counter=0;ende=true;} if(spalten>5){spalten=1;rhe=true;} if(wechsel>bildanz){wechsel=1;} if(spalten>0&&spalten<6){document.getElementById("r"+reihen+"s"+spalten).src=Bilder[wechsel].src;} if(rhe==true){if (wechsel<=bildanz){wechsel++;pause=true;ende=false;spalten=0;rhe=false;reihen=0;max_wechsel--;} }}
if(max_wechsel>=1){ if(pause==false){mm_dummytime=setTimeout("jalousie()",41);}//Zeiteinstellung für Effekt else {mm_dummytime=setTimeout("jalousie()",3000);pause=false;}} //Zeit für Bilderwechsel }//ef
function spirale_init(){ tempr[1]=5;temps[1]=5;tempr[23]=2;temps[23]=3;tempr[24]=2;temps[24]=4;tempr[25]=3;temps[25]=4; for(i=2;i<=5;i++){tempr[i]=5;temps[i]=temps[i-1]-1;} for(i=6;i<=9;i++){tempr[i]=tempr[i-1]-1;temps[i]=1;} for(i=10;i<=13;i++){tempr[i]=1;temps[i]=temps[i-1]+1;} for(i=14;i<=16;i++){tempr[i]=tempr[i-1]+1;temps[i]=5;} for(i=17;i<=19;i++){tempr[i]=4;temps[i]=temps[i-1]-1;} for(i=20;i<=21;i++){tempr[i]=tempr[i-1]-1;temps[i]=2;} tempr[26]=3;temps[26]=3; tempr[22]=tempr[23];temps[22]=temps[23];
/info=window.open("","test","width=400,scrollbars=1");/ for(j=1;j<=26;j++){ /info.document.write("Nr.: "+j+"Reihen:"+tempr[j]+" Spalten:"+temps[j]+"<BR>");/ ztime=Math.ceil(j*80); mmx=setTimeout("u2b()",ztime); }/j=25; rhe=false;pause=false;/ /spirale();/ } function u2b(){ j--; if(j>26)j=1; document.getElementById("r"+tempr[j]+"s"+temps[j]).src=Bilder[2].src; } function spirale(){
j--; if(j=1){j=25;rhe=true;} if(wechsel>=bildanz){wechsel=1;} if(rhe==false){document.getElementById("r"+tempr[j]+"s"+temps[j]).src=Bilder[wechsel].src;} if(rhe==true){if (wechsel<=bildanz){wechsel++;pause=true;rhe=false;j=0;max_wechsel--;}} if(max_wechsel>=1){ if(pause==false){mm_dummytime=setTimeout("spirale()",250);}//Zeiteinstellung für Effekt else {mm_dummytime=setTimeout("spirale()",3000);pause=false;} } //Zeit für Bilderwechsel
} // --> </script> </head> <!-- preloader--> <img src="http://iaweb.org/images/button6.jpg"; width="1px" height="1px"> <img src="http://iaweb.org/images/button1.jpg" width="1px" height="1px"> <img src="http://iaweb.org/images/button4.jpg" width="1px" height="1px"> <img src="http://iaweb.org/images/button5.jpg" width="1px" height="1px"> <img src="http://iaweb.org/images/button2.jpg" width="1px" height="1px">
<!-- ende preloader -->
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000" onload="spirale_init()"> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(0px 20px 20px 0px);z-index:1"><img id="r1s1" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(0px 40px 20px 20px);z-index:2"><img id="r1s2" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(0px 60px 20px 40px);z-index:3"><img id="r1s3" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(0px 80px 20px 60px);z-index:4"><img id="r1s4" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(0px 100px 20px 80px);z-index:5"><img id="r1s5" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div>
<DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(20px 20px 40px 0px);z-index:1"><img id="r2s1" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(20px 40px 40px 20px);z-index:2"><img id="r2s2" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(20px 60px 40px 40px);z-index:3"><img id="r2s3" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(20px 80px 40px 60px);z-index:4"><img id="r2s4" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(20px 100px 40px 80px);z-index:5"><img id="r2s5" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div>
<DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(40px 20px 60px 0px);z-index:1"><img id="r3s1" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(40px 40px 60px 20px);z-index:2"><img id="r3s2" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(40px 60px 60px 40px);z-index:3"><img id="r3s3" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(40px 80px 60px 60px);z-index:4"><img id="r3s4" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(40px 100px 60px 80px);z-index:5"><img id="r3s5" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div>
<DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(60px 20px 80px 0px);z-index:1"><img id="r4s1" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(60px 40px 80px 20px);z-index:2"><img id="r4s2" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(60px 60px 80px 40px);z-index:3"><img id="r4s3" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(60px 80px 80px 60px);z-index:4"><img id="r4s4" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(60px 100px 80px 80px);z-index:5"><img id="r4s5" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div>
<DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(80px 20px 100px 0px);z-index:1"><img id="r5s1" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(80px 40px 100px 20px);z-index:2"><img id="r5s2" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(80px 60px 100px 40px);z-index:3"><img id="r5s3" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(80px 80px 100px 60px);z-index:4"><img id="r5s4" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div> <DIV style="position:absolute;top:10px;left:10px;border:ridge 1px black;clip:rect(80px 100px 100px 80px);z-index:5"><img id="r5s5" src="http://www.iaweb.org/images/button2.jpg" width=100px height=100px></div>
</body> </html>