Phiên bản đầy đủ: jsB@nk » Hình ảnh » Trình diễn ảnh » Trình diễn ảnh với chuyển tiếp tròn
URL: https://www.javascriptbank.com/slideshow-with-circle-transition-effect-index.html
Hiệu ứng tạo một trình diễn ảnh trên trang web với hiệu ứng chuyển tiếp giữa các ảnh là các vòng tròn đồng tâm di chuyển từ trong ra ngoài và từ ngoài vào trong.
Phiên bản đầy đủ: jsB@nk » Hình ảnh » Trình diễn ảnh » Trình diễn ảnh với chuyển tiếp tròn
URL: https://www.javascriptbank.com/slideshow-with-circle-transition-effect-index.html
<SCRIPT LANGUAGE="JavaScript"><!-- Beginning of JavaScript -// Slideshow with circle transition effect by Urs Dudli and Peter Gehrig // Copyright (c) 2000 Peter Gehrig and Urs Dudli // the 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"// the 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// Configure the speed of the transition effect. Less means fastervar pause=50// Configure the standstill-time of the images (seconds)var standstill=3var 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]="circle01.gif"coverimage[1]="circle02.gif"coverimage[2]="circle03.gif"coverimage[3]="circle04.gif"coverimage[4]="circle05.gif"coverimage[5]="circle1.gif"coverimage[6]="circle2.gif"coverimage[7]="circle3.gif"coverimage[8]="circle4.gif"coverimage[9]="circle5.gif"coverimage[10]="circle6.gif"coverimage[11]="circle7.gif"coverimage[12]="circle8.gif"coverimage[13]="circle11.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-->