»
Tiếng AnhTiếng PhápTiếng Việt

In - Trình diễn ảnh với chuyển tiếp thẳng - JavaScriptBank.com

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

Trình diễn ảnh với chuyển tiếp thẳng © JavaScriptBank.comHiệ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



JavaScript
<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-->


HTML
<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-->


Files
http://javascriptbank.com/javascript/image/Simple_Slideshow_with_striped_transition_effect/Simple_Slideshow_with_striped_transition_effect_images.zip