<html dir=ltr> <HEAD> <TITLE>Five Image Ad Rotator -- A Scriptlet Example</TITLE> <SCRIPT LANGUAGE="JavaScript"> //Variable Definitions // // var teffect = 0; //Index of the current effect var transitions = 23; //Total number of transition effects; 23 is the maximum. var speed=3.0; //Transition speed var index =1; //Index number used to reference images //Array Definitions img = new Array(6); //This array contains the image names link = new Array(6); //This array contains image Web links delay = new Array(6); //This array contains the amount of time that an image should be displayed //This function start the image rotation when this page is loaded into a Web browser. function startRot(){ //Define four ad images to rotate and related Web links // img[1] = "bayshore.jpg"; img[2] = "nyc.jpg"; img[3] = "rock.jpg"; img[4] = "nzealand.jpg"; img[5] = "natpark.jpg"; link[1] = "http://www.microsoft.com"; link[2] = "http://www.microsoft.com"; link[3] = "http://www.microsoft.com"; link[4] = "http://www.microsoft.com"; link[5] = "http://www.microsoft.com"; //Set the amount duration for which each image is displayed delay[1] = 12; delay[2] = 1; delay[3] = 1; delay[4] = 1; delay[5] = 1; //Define dimension of images var imgHeight = 180; var imgWidth = 180; //Define the default images that the rotators displays first and set their dimensions image1.src = img[1]; image1.src = img[2]; imgmap.coords = "0,0," + imgWidth + "," + imgHeight; rotImg.style.height = imgHeight; rotImg.style.width = imgWidth; //Prepare to begin image rotation image1.style.visibility = "hidden"; transImage(); } //When the transition is completed, select a new transition filter. function changeTrans() { if (teffect%5 == 0) { index = 0; } index = index + 1; //Delay next transition by the amount of time (milliseconds) specified by the duration variable window.setTimeout( 'transImage()', duration); } function transImage() { //Freeze image rotImg.filters.item(0).Apply(); rotImg.filters.item(0).transition = teffect; if (teffect % 2 == 0) { image1.src = img[index]; image1.style.visibility = ""; imgmap.href = link[index]; image2.style.visibility = "hidden"; duration = delay[index]*1000; } else { image2.src = img[index]; image2.style.visibility = ""; imgmap.href = link[index]; image1.style.visibility = "hidden"; duration = delay[index]*1000; } //Start transition rotImg.filters(0).Play(speed); bTransInProgress = true; teffect = teffect + 1; if (teffect > transitions) { teffect = 0; } } </SCRIPT> <META HTTP-EQUIV="Content-Type" content="text/html; charset=Windows-1252"> </head> <BODY onload="startRot()" link=white alink=white vlink=white> <!--TOOLBAR_START--> <!--TOOLBAR_EXEMPT--> <!--TOOLBAR_END--> <!-- This image map is defined for images with dimensions of 180 X 180 pixels --> <map name="addmap"> <area id=imgmap shape=rect coords="0,0,180,180" href="http://www.microsoft.com" > </map> <DIV ID="rotImg" STYLE="position:ABSOLUTE; height:175; width:180; top:0; left:0; background-color:black; filter:revealTrans(Duration=4.0, Transition=12)" onFilterChange="changeTrans()"> <IMG id="image1" STYLE="POSITION:absolute;TOP:0;LEFT:0" SRC="bayshore.jpg" usemap=rotate.htm#addmap> <IMG id="image2" STYLE="POSITION:absolute;TOP:0;LEFT:0" SRC="bayshore.jpg" usemap=rotate.htm#addmap> </DIV> </BODY> </HTML>