Sunday, October 12, 2008

How to develop slide show using java script?

Assign all the necessary images or snaps to an array , which can be retrieved based upon index.

In java script we have function called setTimeout which behaves like Thread.sleep.

Example:-
function hi()
{
alert('Hi');
}
var tmr=setTimeout("hi()",2000);
Here user gets an alert box sayinh hi , 2 seconds after the page has been loaded.

Simillarly , for every time the function is called for slide show, increment a variable and index , after incrementing call a function that reads the items from an array based on index that gives image url. Now assign this image url to an "img" tag whose src is updated to the new Image url.


The most generic method for building a slide show is using an xml file, that has tags defined for images with comments,rating,src etc... ,on page load reading the image attributes from xml file and loading into array with specific indexes.

Later with this time out function you can read those images. Also you can switch off the slide show with another function that clears the timer.

Ex:-
clearTimeout(tmr);

No comments: