ITSN Support,
event management software, League administration software, Club
management software, Club management software,Club administration
software, Online Registration, Facility Management Software, League
website, Club website, web-based, registration software, league
scheduling software, database, registration, schedules, standings,
player statistics
|
 |
|
|
|
|
 |
 |
How to create a slide showA slide show is simple a collection of photos or graphics that you have uploaded and that rotate. The slide show below was done by the Edmonton Interdistrict Youth Soccer Association (www.eiysa.com).
Instructions
- Upload the graphics to your graphics directory.
- Create a new page for your slide show. Use the wysiwyg editor Disabled mode (NOTE: if you use it in enable mode the slide show will not work).
- Paste the following code into your document where you want your slide show to appear.
|
<![CDATA[
<HTML>
<head> </head>
<title> </title>
<body>
<SCRIPT language=JavaScript1.2><br>
var slideshow_width=500 //SET IMAGE WIDTH <br>
var slideshow_height=500 //SET IMAGE HEIGHT <br>
var pause=2000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds) <br>
var fadeimages=new Array() <br>
//SET IMAGE PATHS. Extend or contract array as needed<br>
<B>
fadeimages[0]="/leagues/1600/graphics/c1.jpg"<br>
fadeimages[1]="/leagues/1600/graphics/c2.jpg"<br>
fadeimages[2]="/leagues/1600/graphics/c3.jpg"<br>
fadeimages[3]="/leagues/1600/graphics/c4.jpg"<br>
fadeimages[4]="/leagues/1600/graphics/c5.jpg"<br>
fadeimages[5]="/leagues/1600/graphics/c6.jpg"<br>
fadeimages[6]="/leagues/1600/graphics/c7.jpg"<br>
fadeimages[7]="/leagues/1600/graphics/c8.jpg"<br>
fadeimages[8]="/leagues/1600/graphics/c9.jpg"<br>
fadeimages[9]="/leagues/1600/graphics/c11.jpg"<br>
fadeimages[10]="/leagues/1600/graphics/c12.jpg"<br>
fadeimages[11]="/leagues/1600/graphics/c14.jpg"<br>
</B>
<br>
var preloadedimages=new Array()<br>
for (p=0;p<fadeimages.length;p++){<br>
preloadedimages[p]=new Image()<br>
preloadedimages[p].src=fadeimages[p]<br>
} <br>
var ie4=document.all<br>
var dom=document.getElementById<br>
<br>
if (ie4||dom)<br>
document.write('<div <br>style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div id="canvas0"<br> style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opa<br>city:10"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opa<br>city:10"></div></div>')
else<br>
document.write('<img name="defaultslide" src="'+fadeimages[0]+'">')<br>
<br>
var curpos=10<br>
var degree=10<br>
var curcanvas="canvas0"<br>
var curimageindex=0<br>
var nextimageindex=1<br>
<br>
function fadepic(){<br>
if (curpos<100){<br>
curpos+=10<br>
if (tempobj.filters)<br>
tempobj.filters.alpha.opacity=curpos<br>
else if (tempobj.style.MozOpacity)<br>
tempobj.style.MozOpacity=curpos/100<br>
}<br>
else{<br>
clearInterval(dropslide)<br>
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"<br>
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)<br>
tempobj.innerHTML='<img src="'+fadeimages[nextimageindex]+'">'<br>
nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0<br>
setTimeout("rotateimage()",pause)<br>
}<br>
}<br>
<br>
function rotateimage(){<br>
if (ie4||dom){<br>
resetit(curcanvas)<br>
var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)<br>
crossobj.style.zIndex++<br>
var temp='setInterval("fadepic()",50)'<br>
dropslide=eval(temp)<br>
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"<br>
}<br>
else<br>
document.images.defaultslide.src=fadeimages[curimageindex]<br>
curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0<br>
}<br>
<br>
function resetit(what){<br>
curpos=10<br>
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)<br>
if (crossobj.filters)<br>
crossobj.filters.alpha.opacity=curpos<br>
else if (crossobj.style.MozOpacity)<br>
crossobj.style.MozOpacity=curpos/100<br>
}<br>
<br>
function startit(){<br>
var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)<br>
crossobj.innerHTML='<img src="'+fadeimages[curimageindex]+'">'<br>
rotateimage()<br>
}<br>
<br>
if (ie4||dom)<br>
window.onload=startit<br>
else<br>
setInterval("rotateimage()",pause)<br>
<br>
</script></body>
</html>
]]>
|
4. Edit the lines that in bold. Replace the leagueID of 1600 with your leagueID and change the name of the files at the end of the line to your file names that you uploaded in step 1.
Created by: Beth Draper -- Last updated:Jul 26, 2006
|
| |
|
 |
|
 |
HOME
