My capabilities as a graphic designer My portfolio of design work My approach to graphic design My laboratory - where I experiment with design A place for me to vent my thoughts
X-lab.co.uk - experimenting with design
Slide Show Javascript
Slide Show Javascript Example


The Slide Show Javascript used above is set to display a different image every four seconds

This javascript slide show is the same as the image rotation javascript. Using the slide show javascript you can display different photographs in rotation like a slide show on your web page. It is ideal for digital photographs. You can add as many pictures to the array declared at the beginning of the slide show javascript as you want. I would recommend preloading images if you intend to display a lot of photos or if the images are large file sizes.

This slide show javascript can be used to rotate any number of images and display them for any amount of time before the next one is displayed.

NB. Name the first image placed on your web page "MyImage" otherwise the slide show javascript will not work. Your image tag will look something like the example below

<img src="images/image_rotation_one.jpg" alt="Image for Rotation" name="MyImage" width="200" height="75" id="MyImage"></img>

Slide Show Javascript

Please remember to put the path to your own images in the PhotoArray otherwise the slide show javascript will not work.

Simply click inside the window below, use your cursor to highlight the javascript, and copy [Control]+C the javascript into a new file in your text editor (such as Note Pad) and save [Control+S].