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 thẳng
URL: https://www.javascriptbank.com/simple-slideshow-with-striped-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 đường thẳng nằm ngang 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 thẳng
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