网页代码设计技巧系列之---变化的多幅图片.docVIP

脚本说明:把如下代码加入body区域中script language=JavaScript1.2//Drop-in slideshow- By Dynamic Drive//For full source code and more DHTML scripts, visit //This credit MUST stay intact for usevar slideshow_width=140 //SET SLIDESHOW WIDTH (set to largest images width if multiple dimensions exist)var slideshow_height=225 //SET SLIDESHOW HEIGHT (set to largest images height if multiple dimensions exist)var pause=3000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds)var dropimages=new Array()//SET IMAGE PATHS. Extend or contract array as neededdropimages[0]=photo1.jpgdropimages[1]=photo2.jpgdropimages[2]=photo3.jpg////NO need to edit beyond here/////////////var preloadedimages=new Array()for (p=0;pdropimages.length;p++){preloadedimages[p]=new Image()preloadedimages[p].src=dropimages[p]}var ie4=document.allnavigator.userAgent.indexOf(Opera)==-1var dom=document.getElementByIdnavigator.userAgent.indexOf(Opera)==-1if (ie4||dom)document.write(div style=position:relative;width:+slideshow_width+;height:+slideshow_height+;overflow:hiddendiv id=canvas0 style=position:absolute;width:+slideshow_width+;height:+slideshow_height+;top:-+slideshow_height+/divdiv id=canvas1 style=position:absolute;width:+slideshow_width+;height:+slideshow_height+;top:-+slideshow_height+/div/div)elsedocument.write(img name=defaultslide src=+dropimages[0]+)var curpos=slideshow_height*(-1)var degree=10var curcanvas=canvas0var curimageindex=0var nextimageindex=1function movepic(){if (curpos0){curpos=Math.min(curpos+degree,0)tempobj.style.top=curpos}else{clearInterval(dropslide)nextcanvas=(curcanvas==canvas0)? canvas0 : canvas1tempobj=ie4? eval(document.all.+nextcanvas) : document.getElementById(nextcanvas)tempobj.innerHTML=img src=+dropimages[nextimageindex]+nextimageindex=(nextimageindexdropimages.length-1)? nextimageindex+1 : 0setTimeout(rotateimage(),pause)}}function rotateimage(){if (ie4||dom){resetit(curcanvas)var crossobj=tempobj=ie4? eval(document.all.+curcanvas) :