timed javascript slideshow.

**pdxSherpa** · Dec 16, 2012 16:13

currently using this code for to do an "on refresh" slideshow.

Code:

var image = new Array()

image[0] = "imgArray/gallery01.jpg"
image[1] = "imgArray/gallery02.jpg"
image[2] = "imgArray/gallery03.jpg"
image[3] = "imgArray/gallery04.jpg"
image[4] = "imgArray/gallery05.jpg"
image[5] = "imgArray/gallery06.jpg"
image[6] = "imgArray/gallery07.jpg"
image[7] = "imgArray/gallery08.jpg"
image[8] = "imgArray/gallery09.jpg"
image[9] = "imgArray/gallery10.jpg"

function randomNumber(n){
number = Math.floor(Math.random() * (n + 1));
return number;

and later in the page in a div

Code:

<script type="text/javascript"> document.write( "<img src = '" + image[randomNumber(image.length -1)]+ "'>" );</script>

is there a super simple way to change this so it is timed instead?
thx
Sherpa

**vwphillips** · Dec 17, 2012 00:18

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
<script type="text/javascript">
/*<![CDATA[*/
var image = new Array()

image[0] = "http://www.vicsjavascripts.org.uk/StdImages/Egypt5.jpg"
image[1] = "http://www.vicsjavascripts.org.uk/StdImages/Egypt6.jpg"
image[2] = "http://www.vicsjavascripts.org.uk/StdImages/Egypt7.jpg"
image[3] = "http://www.vicsjavascripts.org.uk/StdImages/Egypt8.jpg"
image[4] = "http://www.vicsjavascripts.org.uk/StdImages/Egypt9.jpg"

function randomNumber(id,ary,ms){
 var src = ary[Math.floor(Math.random()*ary.length)],img=document.getElementById(id),ms=typeof(ms)=='number'&&ms>100?ms:1000;
 if (img){
  img.src=src;
 }
 setTimeout(function(){ randomNumber(id,ary,ms) },ms);
 return src;

}
/*]]>*/
</script></head>

<body>
<script type="text/javascript">
 document.write( "<img id='tst' src = '" + randomNumber('tst',image,1000)+ "'>" );
 </script>
</body>

</html>

**pdxSherpa** · Dec 17, 2012 21:01

Thank you, Will go try it out!

was wondering what is:
<![CDATA[*/ for? have not seen this before.

D

**ralph.m** · Dec 18, 2012 01:13

Originally Posted by pdxSherpa

was wondering what is:
<![CDATA[*/ for? have not seen this before.

It's needed when you are embedding JavaScript and CSS code in an XHTML document. (These both contain characters that aren't allowed in an XHTML document, so the CDATA wrapper kind of seals them off from the rest of the document.) Another reason not to bother with XHTML.

**felgall** · Dec 18, 2012 02:27

Originally Posted by ralph.m

It's needed when you are embedding JavaScript and CSS code in an XHTML document.

No it isn't - if you were embedding JavaScript in an XHTML document (rather than writing your JavaScript properly as a separate file) then you wouldn't be commenting those tags out. With the tags commented out the page can be identified as HTML rather than XHTML and the person that wrote the code can be identified as someone who doesn't know the difference between HTML and XHTML.

The only current reason not to bother with XHTML is that IE8 doesn't support it and is still used by too many people to have web pages that they have offered as downloads rather than displayed in their browser. Only once IE8 is dead will XHTML become possible - that's why there is a new proposed version called XHTML 5.

User Tag List

Thread: timed javascript slideshow.

Thread Tools

Display

timed javascript slideshow.

Bookmarks

Bookmarks

Posting Permissions