Script Categories

Graphic >>> Image Cycler.

Cycle through a group of images in a single location on your page. For best results all images should be near each other in size. You set the time interval for the change of images.

Step 1: Add the below code to the <body> section of your page:

<script language="javascript" type="text/javascript">
/* Visit for full source code
and get more free JavaScript, CSS and DHTML scripts! */
<!-- Begin
var timeDelay = 3; // change delay time in seconds
var Pix = new Array
var howMany = Pix.length;
timeDelay *= 1000;
var PicCurrentNum = 0;
var PicCurrent = new Image();
PicCurrent.src = Pix[PicCurrentNum];
function startPix() {
setInterval("slideshow()", timeDelay);
function slideshow() {
if (PicCurrentNum == howMany) {
PicCurrentNum = 0;
PicCurrent.src = Pix[PicCurrentNum];
document["ChangingPix"].src = PicCurrent.src;
//  End -->
<img name="ChangingPix" width="330" height="190" src="toad.jpg">

Step 2: The script uses 4 images as part of its interface. You can create your own, or use the 4 below (resized for easier download):

(right click images, and select "Save Image As")
Upload them into the same directory as your webpage.

JavaScript Editor Get Advanced
JavaScript and Ajax Editor,
Validator and Debugger!

1st JavaScript Editor.

Code was highlighted by 1st JavaScript Editor (The Best JavaScript Editor!).