Full version: jsB@nk » Image » Slideshow » Simple Slideshow with striped transition effect
URL: https://www.javascriptbank.com/simple-slideshow-with-striped-transition-effect-index.html
This crossbrowser slideshow uses an eycatching transition effect between the images. Each image has a JavaScript link of its own. Add as many images as you like. Easy copy-and-paste configuration.
Full version: jsB@nk » Image » Slideshow » Simple Slideshow with striped transition effect
URL: https://www.javascriptbank.com/simple-slideshow-with-striped-transition-effect-index.html
<SCRIPT LANGUAGE="JavaScript"><!-- Beginning of JavaScript -// Simple Slideshow with striped transition effect by Urs Dudli and Peter Gehrig // Copyright (c) 2000 Peter Gehrig and Urs Dudli // file-names of your slideshow's images. Add as may as you like.var imgsname=new Array()imgsname[0]="../logojs.gif"imgsname[1]="../logojs.gif"imgsname[2]="../logojs.gif"// links for each image. You MUST add a link for each imagevar imgslink=new Array()imgslink[0]="http://javascriptbank.com"imgslink[1]="http://javascriptbank.com"imgslink[2]="http://javascriptbank.com"// vertical position of the slideshow (distance to the top margin of the webpage, pixels)var imgstop=10// horizontal position of the slideshow (distance to the left margin of the webpage, pixels)var imgsleft=10// speed of the transition effect. Less means fastervar pause=50// standstill-time of the images (seconds)var standstill=2var imgpreload=new Array()for (i=0;i<=imgsname.length-1;i++) {imgpreload[i]=new Image()imgpreload[i].src=imgsname[i]}var coverimage = new Array()coverimage[0]="stripes0.gif"coverimage[1]="stripes1.gif"coverimage[2]="stripes2.gif"coverimage[3]="stripes3.gif"coverimage[4]="stripes4.gif"coverimage[5]="stripes5.gif"coverimage[6]="stripes6.gif"coverimage[7]="stripes7.gif"var covimgpreload=new Array()for (i=0;i<=coverimage.length-1;i++) {covimgpreload[i]=new Image()covimgpreload[i].src=coverimage[i]}var i_imgs=0var i_loop=0var thisurl=0var timervar coverwidthvar coverheightstandstill=standstill*1000function init() { if (document.all) { document.all.imgs.style.posTop=imgstop document.all.imgs.style.posLeft=imgsleft document.all.cover.style.posTop=imgstop document.all.cover.style.posLeft=imgsleftimgs.innerHTML="<img name='imgsback' src='"+imgsname[i_loop]+"' border=0>"coverwidth=imgs.offsetWidthcoverheight=imgs.offsetHeightcover.innerHTML="<a href='javascript:gotourl()'><img width="+coverwidth+" height="+coverheight+" name='imgcover' src='"+coverimage[i_loop]+"' border=0></a>" enlargehearts() }if (document.layers) { document.imgs.top=imgstop document.imgs.left=imgsleft document.cover.top=imgstop document.cover.left=imgsleftdocument.imgs.document.write("<img name='imgsback' src='"+imgsname[i_loop]+"' border=0>")document.imgs.document.close()coverwidth=document.imgs.document.widthcoverheight=document.imgs.document.heightdocument.cover.document.write("<a href='javascript:gotourl()'><img width="+coverwidth+" height="+coverheight+" name='imgcover' src='"+coverimage[i_loop]+"' border=0></a>")document.cover.document.close() enlargehearts() }}function enlargehearts() { if (i_loop<=coverimage.length-1) { if (document.all) { imgcover.src=coverimage[i_loop] } if (document.layers) { document.cover.document.imgcover.src=coverimage[i_loop] } i_loop++ timer= setTimeout("enlargehearts()",pause) } else { clearTimeout(timer) i_loop-- timer= setTimeout("shrinkhearts()",standstill) }}function shrinkhearts() { if (i_loop>=0) { if (document.all) { imgcover.src=coverimage[i_loop] } if (document.layers) { document.cover.document.imgcover.src=coverimage[i_loop] } i_loop-- timer= setTimeout("shrinkhearts()",pause) } else { clearTimeout(timer) i_loop=0 i_imgs++ if (i_imgs>=imgsname.length) {i_imgs=0} if (document.all) { imgsback.src=imgsname[i_imgs] } if (document.layers) { document.imgs.document.imgsback.src=imgsname[i_imgs] } timer= setTimeout("enlargehearts()",(4*pause)) }}function gotourl() {document.location.href=imgslink[i_imgs]}window.onload=init</SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<DIV ID="imgs" style="position:absolute;"></DIV><DIV ID="cover" style="position:absolute;"></DIV><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
http://javascriptbank.com/javascript/image/Simple_Slideshow_with_striped_transition_effect/Simple_Slideshow_with_striped_transition_effect_images.zip