Banner-Slideshow

HTML-Einbindung
<!-- Script-Anfang --> <!-- www-java24.net - DIE Javascript - Ressource --> <!-- Diesen Code musst Du in den -body- einbauen --> <!-- CODE FOR GUM SLIDESHOW STARTS HERE --> <!-- Set the width and height of the slideshow inside the table below. Make sure to set the height of the table about 30 (pixels) higher than the actual height of your images. That ensures that there is enough room for your comments --> <table width=400 height=90><tr><td> <script> // CREDITS: // Gum Slideshow 3.11 // By Peter Gehrig // Copyright (c) 2004 Peter Gehrig and Urs Dudli. All rights reserved. // Permission given to use the script provided that this notice remains as is. // Additional scripts can be found at http://www.24fun.com // info@24fun.com // 1/31/2004 // IMPORTANT: // If you add this script to a script-library or script-archive // you have to add a highly visible link to // http://www.24fun.com on the webpage // where this script will be featured // CONFIGURATION: // Go to http://www.24fun.com // and create your own slideshow // with our new Slideshow Fayctory. var slideurl=new Array() var slidecomment=new Array() var slidelink=new Array() var slidetarget=new Array() /////////////////////////////////////////////////////////////////////////// // EDIT-ZONE STARTS HERE ////////////////////////////////////////////////////////////////////////// // Set the URLs of your slides (images) slideurl[0]="http://www.java24.net/gif/banner_468_60.gif" slideurl[1]="http://www.java24.net/gif/banner_468_60.gif" slideurl[2]="http://www.java24.net/gif/banner_468_60.gif" // Add a link for each slide // If you don't want to link a slide type "#" instead (see middle-sample below) slidelink[0]="http://www.java24.net" slidelink[1]="http://www.abo.java24.net" slidelink[2]="http://www.toplist.java24.net" // Add a target for each link // Allowed values are: "_blank", "_top", "_parent", "_self" or the name of a frame slidetarget[0]="_blank" slidetarget[1]="_blank" slidetarget[2]="_blank" // Add a comment for each slide slidecomment[0]="java24.net - DIE Javascript-Ressource" slidecomment[1]="java24.net - DAS java24.net - Abo" slidecomment[2]="java24.net - DAS Javascript-Forum" // Set the font for the comments var slidefont="Verdana" // Set the fontcolor for the comments var slidefontcolor="#666633" // Set the fontsize for the comments (HTML-values ranging form 1 - 6) var slidefontsize=1 // Set the width of the pictures (pixels) var slidewidth=468 // Set the height of the pictures (pixels) var slideheight=60 // Set the pause between the pictures (seconds) var pause=3 /////////////////////////////////////////////////////////////////////////// // EDIT-ZONE ENDS HERE ////////////////////////////////////////////////////////////////////////// var preloadedimages=new Array() for (i=0;i<slideurl.length;i++){ preloadedimages[i]=new Image() preloadedimages[i].src=slideurl[i] } var ns4=document.layers?1:0 var ns6=document.getElementById&&!document.all?1:0 var ie=document.all?1:0 var imgpreload=new Array() for (i=0;i<=slideurl.length-1;i++) { imgpreload[i]=new Image() imgpreload[i].src=slideurl[i] } var pos_left=0 var pos_top=0 var speed=20 var step=10 var i_loop=0 var i_image1=0 var i_image2=1 var i_space="" var all_space="" var max_space=20 var content="" var i_slide=0 pause*=1000 function stretchimage() { if (i_loop<=slidewidth) { if (ie) { imgcontainer1.innerHTML="<a href='"+slidelink[i_image1]+"' target='"+slidetarget[i_image1]+"'><img width='"+i_loop+"' height='"+slideheight+"' src='"+slideurl[i_image1]+"' border='0'></a>" document.all.imgcontainer2.style.posLeft=document.all.imgcontainer1.style.posLeft+i_loop imgcontainer2.innerHTML="<a href='"+slidelink[i_image2]+"' target='"+slidetarget[i_image2]+"'><img width='"+(slidewidth-i_loop)+"' height='"+slideheight+"' src='"+slideurl[i_image2]+"' border='0'></a>" } if (ns6) { document.getElementById('imgcontainer1').innerHTML="<a href='"+slidelink[i_image1]+"' target='"+slidetarget[i_image1]+"'><img width='"+i_loop+"' height='"+slideheight+"' src='"+slideurl[i_image1]+"' border='0'></a>" document.getElementById('imgcontainer2').style.left=parseInt(document.getElementById('imgcontainer1').style.left)+i_loop document.getElementById('imgcontainer2').innerHTML="<a href='"+slidelink[i_image2]+"' target='"+slidetarget[i_image2]+"'><img width='"+(slidewidth-i_loop)+"' height='"+slideheight+"' src='"+slideurl[i_image2]+"' border='0'></a>" } i_loop=i_loop+step var timer=setTimeout("stretchimage()",speed) } else { clearTimeout(timer) var imgcontent="<a href='"+slidelink[i_image1]+"' target='"+slidetarget[i_image1]+"'><img width='"+i_loop+"' height='"+slideheight+"' src='"+slideurl[i_image1]+"' border='0'></a><br><font face='"+slidefont+"' size="+slidefontsize+" color='"+slidefontcolor+"'>"+slidecomment[i_image1]+"</font>" if (ie) { imgcontainer1.innerHTML=imgcontent document.all.imgcontainer2.style.posLeft=document.all.imgcontainer1.style.posLeft+i_loop imgcontainer2.innerHTML="" } if (ns6) { document.getElementById('imgcontainer1').innerHTML=imgcontent document.getElementById('imgcontainer2').style.left=parseInt(document.getElementById('imgcontainer1').style.left)+i_loop document.getElementById('imgcontainer2').innerHTML="" } changeimage() } } function changeimage() { i_loop=0 i_image1++ if (i_image1>slideurl.length-1) {i_image1=0} i_image2=i_image1-1 if (i_image2>slideurl.length-1) {i_image2=0} if (i_image2<0) {i_image2=slideurl.length-1} if (ie) { document.all.imgcontainer2.style.posLeft=document.all.imgcontainer1.style.posLeft } if (ns6) { document.getElementById('imgcontainer2').style.left=parseInt(document.getElementById('imgcontainer2').style.left) } var timer=setTimeout("stretchimage()",pause) } function simpleslideshow() { i_slide++ if (i_slide>=slideurl.length) {i_slide=0} document.slideimage.src=preloadedimages[i_slide].src simpleslideshowcomment() var fadetimer=setTimeout("simpleslideshow()",pause) } function simpleslideshowcomment() { if (i_space>=0){ all_space="" content="" for (i=0;i<i_space;i++) { all_space+=" " } for (i=0;i<slidecomment[i_slide].length;i++) { var thisletter=slidecomment[i_slide].substring(i,i+1) thisletter=thisletter+all_space content+=thisletter } window.status=content i_space-- var fadetimer=setTimeout("simpleslideshowcomment()",20) } else { clearTimeout(fadetimer) i_space=max_space } } function simpleslideshowjump() { if (slidetarget[i_slide]=="_self") { document.location.href=slidelink[i_slide] } else if (slidetarget[i_slide]=="_blank") { codepopup=window.open(slidelink[i_slide], "code", "status=yes,location=yes,toolbar=yes,menubar=yes,resizable=yes,scrollbars=yes,width=780,height=580,top=10,left=10"); } else if (slidetarget[i_slide]=="_top") { top.location.href=slidelink[i_slide] } else if (slidetarget[i_slide]=="_parent") { parent.location.href=slidelink[i_slide] } else { var jumpto=eval("parent."+slidetarget[i_slide]) jumpto.location.href=slidelink[i_slide] } } if (ie || ns6) { var slideh=slideheight+30 document.write("<div style=\"position:relative;width:"+slidewidth+"px;height:"+slideh+"px;overflow:hidden\">") document.write("<div id=\"imgcontainer1\" style=\"position:absolute;width:"+slidewidth+"px;height:"+slideh+"px;top:0px;left:0px\"><img src=\""+slideurl[0]+"\"></div>") document.write("<div id=\"imgcontainer2\" style=\"position:absolute;width:"+slidewidth+"px;height:"+slideh+"px;top:0px;left:0px\"><img src=\""+slideurl[1]+"\"></div>") document.write("</div>") window.onload=stretchimage } else { document.write("<a href=\"javascript:simpleslideshowjump()\"><img name=\"slideimage\" src=\""+slideurl[0]+"\" border=0></a>") window.onload=simpleslideshow } </script> </td></tr></table> <!-- CODE FOR GUM SLIDESHOW ENDS HERE --> <!-- Script-Ende --> <!-- www-java24.net - DIE Javascript - Ressource -->