<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>