<html dir=ltr> <HEAD> <TITLE>Four 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(5); //This array contains the image names link = new Array(5); //This array contains image Web links //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] = "nyc.jpg"; img[2] = "rock.jpg"; img[3] = "nzealand.jpg"; img[4] = "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"; //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%4 == 0) { index = 0; } index = index + 1; //Delay rendering next image for 1 second (1000 milliseconds) window.setTimeout( 'transImage()', 1000); } 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"; } else { image2.src = img[index]; image2.style.visibility = ""; imgmap.href = link[index]; image1.style.visibility = "hidden"; } //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="" usemap=rotate.htm#addmap> <IMG id="image2" STYLE="POSITION:absolute;TOP:0;LEFT:0" SRC="" usemap=rotate.htm#addmap> </DIV> </BODY> </HTML>