// Our tracking variables

 var contentAreas = 5; // Total number of content areas in rotation

 var contentIndex = 1; // Keeps track of which content area is currently being displayed

 var continueRotation = 0; // Used to track whether rotation is currently on or off

 var rotationInProgress = 0; // Used to track when we are on delay before rotateContent is executed

 var changeDelay = 5000; // in milliseconds

 

 // This function hanles all of the content rotation

 function rotateContent(){ 

 if (continueRotation == 1)

 {

 var contentAreaID = 'contentArea' + contentIndex;

 // Turn off current content area

 document.getElementById(contentAreaID).setAttribute('style','display: none')

 // Turn on next content area

 if (contentIndex == contentAreas)

 {

 // Roll back to the first area

 contentIndex = 1;

 }

 else

 {

 contentIndex = contentIndex + 1;

 }

 contentAreaID = 'contentArea' + contentIndex;

 document.getElementById(contentAreaID).setAttribute('style','display: inline')

 // Call the rotation function again with the delay interval we defined above

 setTimeout("rotateContent()",changeDelay);

 // Rotation continues, set rotationInProgress

 rotationInProgress = 1;

 }

 else

 {

 // Rotation is stopped, reset rotationInProgress

 rotationInProgress = 0;

 }

 }

 

 // This starts/restarts the content rotation

 function rotationStart() {

 continueRotation = 1;

 // Only call the rotation function when we are not

 // in the middle of a rotation delay

 if (rotationInProgress == 0)

 {

 rotationInProgress = 1;

 setTimeout("rotateContent()",changeDelay);

 }

 }

 

 // This stops the content rotation

 function rotationStop() {

 // Stop rotation by setting the continueRotation flag to zero

 continueRotation = 0;

 }