Pierwsza opcja:
KOD
<script language="javascript">
var delay=7000 //set delay in miliseconds
var curindex=0
var randomimages=new Array()
randomimages[0]="0.jpg"
randomimages[1]="1.jpg"
randomimages[2]="2.jpg"
randomimages[3]="3.jpg"
var preload=new Array()
for (n=0;n<randomimages.length;n++)
{
preload[n]=new Image()
preload[n].src=randomimages[n]
}
document.write('<img name="defaultimage" src="'+randomimages[Math.floor(Math.random()*(randomimages.length))]
+'">')
function rotateimage()
{
if (curindex==(tempindex=Math.floor(Math.random()*(randomimages.length))
)){
curindex=curindex==0? 1 : curindex-1
}
else
curindex=tempindex
document.images.defaultimage.src=randomimages[curindex]
}
setInterval("rotateimage()",delay)
</script>
<br /></p>
Źródło: [http://www.javascriptkit.com - By Tyler Clarke]
Druga opcja to zrobić coś takiego we flashu ale polecam skorzystać z pierwszej. Wystarczy, że wrzucisz jpg'i i masz pożądany efekt.
Dodatkowo poniżej masz skrypt, gdzie obrazki możesz podlinkować aby prowadziły to określonych np. podstron.
KOD
<script language="javascript">
/*
Random image slideshow- By Tyler Clarke (tyler@ihatecoffee.com)
For this script and more, visit http://www.javascriptkit.com
*/
var delay=5000 //set delay in miliseconds
var curindex=0
var randomimages=new Array()
randomimages[0]="pic1.jpg"
randomimages[1]="pic2.jpg"
randomimages[2]="pic3.jpg"
randomimages[3]="pic4.jpg"
randomimages[4]="pic5.jpg"
var randomhrefs=new Array()
randomhrefs[0]="site1.htm"
randomhrefs[1]="site2.htm"
randomhrefs[2]="site3.htm"
randomhrefs[3]="site4.htm"
randomhrefs[4]="site5.htm"
var preload=new Array()
for (n=0;n<randomimages.length;n++)
{
preload[n]=new Image()
preload[n].src=randomimages[n]
}
var random=Math.floor(Math.random()*(randomimages.length));
document.write('<a href="'+randomhrefs[random]+'" name="hrefs"><img name="defaultimage" src="'+randomimages[random]+'"></a>')
function rotateimage()
{
if (curindex==(tempindex=Math.floor(Math.random()*(randomimages.length)))){
curindex=curindex==0? 1 : curindex-1
}
else
curindex=tempindex
document.images.defaultimage.src=randomimages[curindex]
document.links.hrefs.href=randomhrefs[curindex]
}
setInterval("rotateimage()",delay)
</script>
Źródło: peb.pl