JavaScrip Class notes: Lesson 4

Lesson Four
April 28th 03

New scripts on setTimeout: original scripts and demo by Robert.

A -Review: See last lessons for review on:

1- Predownloading pictures.
2- Getting the slide show going: Declaring and calling functions
3- Reserving a space for the picture:

B- New scripts: setTimeout

Click HERE for setTimeout1.html an atomatic slide show with 8 pictures rolling in a loop with one second interval. You can also set each picture to stay at a certain time by setting the setTimeout right. Click HERE for setTimeout2.html

For example:

setTimeout("document.slide.src=row[2].src",4000);
setTimeout("document.slide.src=row[4].src",6000);

Our wish is to have more control of the banner on the upper right hand side of the S.C. front page. As it is now, one can click on one picture of the banner to go to another link with more detailed information. But how about if the viewers aren't fast enough to catch the picture he likes to stop?

Bruce came up with a brilliant idea: Here is the new automatic slide show with setTimeOut and a pair of event handlers to stop the loop so that the users/viewers can take time to make the decision. Click HERE for banner1.html and HERE for banner2.html

To go to another page when clicking on the pictures, see codes and samples in Lesson 2 or Lesson three with Atoslide and Navigation. Sample of codes for navigation: function gothere() { if(k==0){document.location.href=" http://pws.prserv.net/hoangtv/"}; if(k==1){document.location.href="JSlesson3.html"}; if(k==2){document.location.href="http://www.seniorcenterinc.org/programs/programs .html"}; if(k==3){document.location.href="summer.html"}; };


End of lesson4

See you later in lesson 5. If I am still alive and kicking by then.