Библиотека Javascript. SE@RCHER

<html> <head> <TITLE>Фото автозаменяется с эффектами zoom-effect и fade-effect.</TITLE> <meta NAME="keywords" CONTENT="DHTML, scroller, ticker, message, JavaScript, flash, news, animation, download, free, samples, applet, text, JavaScript"> <meta NAME="description" CONTENT="Flashlike slideshow combining zoom-effect and fade-effect. The script automatically puts your pictures into the center of the browser-window. Add as many pictures as you like. True copy-and-paste installation. Very easy configuration of your images. You achieve the best results by using small images. Made for IE4x."> </HEAD> <body bgcolor="#FFFFFF"> <script> var zoomimages=new Array("testpic0.gif","testpic1.gif","testpic2.gif","testpic3.gif") </script> <script > var imgpreload=new Array() for (i=0;i<=zoomimages.length;i++) { imgpreload[i]=new Image() imgpreload[i].src=zoomimages[i] } var zoomfactor=8 var positionleft=0 var positiontop=0 var timer var marginright=0 var i_fadestrength=5 var i_images=0 var step=1 var content var imageboxwidth=0 var imageboxheight=0 var bodywidth=0 var bodyheight=0 function setimage() { bodywidth=document.body.clientWidth bodyheight=document.body.clientHeight if (i_images>=zoomimages.length) {i_images=0} content="<img name='newpic' src='"+zoomimages[i_images]+"'>" imagebox.innerHTML=content timer=setTimeout("resizeimage()",50) } function resizeimage() { if (i_fadestrength<120) { imageboxwidth+=zoomfactor content="<img name='newpic' src='"+zoomimages[i_images]+"' width='"+imageboxwidth+"'>" imagebox.innerHTML=content imageboxwidth=document.newpic.width imageboxheight=document.newpic.height imagebox.filters.alpha.opacity=Math.floor(100-i_fadestrength) document.all.imagebox.style.posLeft=bodywidth/2-imageboxwidth/2 document.all.imagebox.style.posTop=bodyheight/2-imageboxheight/2 document.all.imagebox.style.overflowX="hidden" document.all.imagebox.style.visibility="visible" step+=1.5 i_fadestrength+=step timer=setTimeout("resizeimage()",50) } else { clearTimeout(timer) i_fadestrength=0; step=1; i_images++ imageboxwidth=0 setimage() } } if (document.all) { document.write("<DIV id='imagebox' style='position:absolute;filter:alpha(opacity=0);'></DIV>") } if (document.all) { onload=setimage } </script> <font size=2 color=black face=Verdana><b>Flashlike slideshow combining zoom-effect and fade-effect</b><br>Flashlike slideshow combining zoom-effect and fade-effect. The script automatically puts your pictures into the center of the browser-window. Add as many pictures as you like. True copy-and-paste installation. Easy configuration of your images. You will achieve the best results by using small images. Made for IE4x.<br><br><br> <form> <b>Configuration:</b><br><br> <b>Step 1:</b> <a href="imgfadezoom.zip">Download the file 'imgfadezoom.zip'</a>. Unzip the file 'imgfadezoom.js' and the 4 test-pictures (testpicX.gif). Put the unzipped file 'imgfadezoom.js' and the 4 test-pictures into the same folder as your webpage.<br><br> <b>Step 2:</b> Open your webpage. Paste the following code right above the </body> tag of your webpage:</b><br> <input type=button onClick="this.form.code1.focus();this.form.code1.select()" value="select all" style="font-size:8pt"><br> <textarea name="code1" cols="60" rows="8" style="font-size:8pt"> <script> var zoomimages=new Array("testpic0.gif","testpic1.gif","testpic2.gif","testpic3.gif") </script> <script > var imgpreload=new Array() for (i=0;i<=zoomimages.length;i++) { imgpreload[i]=new Image() imgpreload[i].src=zoomimages[i] } var zoomfactor=8 var positionleft=0 var positiontop=0 var timer var marginright=0 var i_fadestrength=5 var i_images=0 var step=1 var content var imageboxwidth=0 var imageboxheight=0 var bodywidth=0 var bodyheight=0 function setimage() { bodywidth=document.body.clientWidth bodyheight=document.body.clientHeight if (i_images>=zoomimages.length) {i_images=0} content="<img name='newpic' src='"+zoomimages[i_images]+"'>" imagebox.innerHTML=content timer=setTimeout("resizeimage()",50) } function resizeimage() { if (i_fadestrength<120) { imageboxwidth+=zoomfactor content="<img name='newpic' src='"+zoomimages[i_images]+"' width='"+imageboxwidth+"'>" imagebox.innerHTML=content imageboxwidth=document.newpic.width imageboxheight=document.newpic.height imagebox.filters.alpha.opacity=Math.floor(100-i_fadestrength) document.all.imagebox.style.posLeft=bodywidth/2-imageboxwidth/2 document.all.imagebox.style.posTop=bodyheight/2-imageboxheight/2 document.all.imagebox.style.overflowX="hidden" document.all.imagebox.style.visibility="visible" step+=1.5 i_fadestrength+=step timer=setTimeout("resizeimage()",50) } else { clearTimeout(timer) i_fadestrength=0; step=1; i_images++ imageboxwidth=0 setimage() } } if (document.all) { document.write("<DIV id='imagebox' style='position:absolute;filter:alpha(opacity=0);'></DIV>") } if (document.all) { onload=setimage } </script>
IMPORTANT: Do not paste this code into tables or between <DIV> and </DIV> tags or between any other container tags!

Step 3: Open your webpage. Replace the names of our test-pictures (red code below) with the names of your pictures:
var zoomimages=new Array("testpic0.gif","testpic1.gif","testpic2.gif","testpic3.gif")

Download 100's of free copy-and-paste scripts