Diaporama transitions automatique. Outils webmaster. Trucs et astuces

<script language="JavaScript1.2" type="text/javascript"> /*********************************************** * Fade-in image slideshow script- � Dynamic Drive DHTML code library (www.dynamicdrive.com) * This notice MUST stay intact for legal use * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code *********************************************** PARAMETRES DE REGLAGE ***********************************************/ var slideshow_width='140px' //ENTREZ LA LARGEUR DE L'IMAGE var slideshow_height='225px' //ENTREZ LA HAUTEUR DE L'IMAGE var pause=3000 //ENTREZ LA PAUSE ENTRE CHAQUE IMAGE (3000=3 seconds) var fadeimages=new Array() //ENTREZ 1) LE CHEMIN DE L'IMAGE, 2) UN LIEN CLIQUABLE OPTIONNEL SUR L'IMAGE, 3), LE CADRE DE DESTINATION OPTIONNEL : fadeimages[0]=["/images/photo1.jpg", "", ""] //SYNTAXE COMPLETE DE L'IMAGE fadeimages[1]=["/images/photo2.jpg", "http://www.google.com", ""] //IMAGE AVEC UN LIEN CLIQUABLE fadeimages[2]=["/images/photo3.jpg", "/trucs/", "_new"] //IMAGE AVEC UN LIEN CLIQUABLE ET UN CADRE DE DESTINATION fadeimages[3]=["/images/photo4.jpg", "https://www.toulouse-renaissance.net/trucs.htm", "_new"] //IMAGE AVEC UN LIEN CLIQUABLE ET UN CADRE DE DESTINATION /////NE RIEN EDITER CI-DESSOUS///////////// var preloadedimages=new Array() for (p=0;p<fadeimages.length;p++){ preloadedimages[p]=new Image() preloadedimages[p].src=fadeimages[p][0] } var ie4=document.all var dom=document.getElementById if (ie4||dom) document.write('<div style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div id="canvas0" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10;visibility: hidden"></div></div>') else document.write('<img name="defaultslide" src="'+fadeimages[0][0]+'">') var curpos=10 var degree=10 var curcanvas="canvas0" var curimageindex=0 var nextimageindex=1 function fadepic(){ if (curpos<100){ curpos+=10 if (tempobj.filters) tempobj.filters.alpha.opacity=curpos else if (tempobj.style.MozOpacity) tempobj.style.MozOpacity=curpos/101 } else{ clearInterval(dropslide) nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1" tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas) tempobj.innerHTML=insertimage(nextimageindex) nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0 var tempobj2=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas) tempobj2.style.visibility="hidden" setTimeout("rotateimage()",pause) } } function insertimage(i){ var tempcontainer=fadeimages[i][1]!=""? '<a href="'+fadeimages[i][1]+'" target="'+fadeimages[i][2]+'">' : "" tempcontainer+='<img src="'+fadeimages[i][0]+'" border="0">' tempcontainer=fadeimages[i][1]!=""? tempcontainer+'</a>' : tempcontainer return tempcontainer } function rotateimage(){ if (ie4||dom){ resetit(curcanvas) var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.style.zIndex++ tempobj.style.visibility="visible" var temp='setInterval("fadepic()",50)' dropslide=eval(temp) curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0" } else document.images.defaultslide.src=fadeimages[curimageindex][0] curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0 } function resetit(what){ curpos=10 var crossobj=ie4? eval("document.all."+what) : document.getElementById(what) if (crossobj.filters) crossobj.filters.alpha.opacity=curpos else if (crossobj.style.MozOpacity) crossobj.style.MozOpacity=curpos/101 } function startit(){ var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas) crossobj.innerHTML=insertimage(curimageindex) rotateimage() } if (ie4||dom) window.onload=startit else setInterval("rotateimage()",pause) </script>