Sequential image refresh on page reload

I have been attempting to write a scrip for images on a page to change on page reload or refresh, the thing is that I dont want the images to be random, I need them to be sequential.

here is what I have, it works, but only in random order, any help would be greatly appreciated, and I thank you all in advance berry berry much.

http://youreonlinetoday.com/paramount/index-test.html

script using:
</script><script type="text/javascript" language="JavaScript">

NumberOfImagesToRotate = 7;

FirstPart = '<img src="./hpphoto/tn_photo';
LastPart = '.jpg" height="240" width="326">';

function printImage() {
var r = Math.ceil(Math.random()() * NumberOfImagesToRotate);
document.write(FirstPart + r + LastPart);
}
//-->
</script>


and then this for image display:
<script type="text/javascript" language="JavaScript"><!--
printImage();
//--></script>

pretty straight forward, nothing fancy, I think where i am wrong is the math.random, but I dont know what to put to make it sequential.

Thanks again!!!:confused

 

You could store a session variable that you could look at to figure out what picture is next or use a cookie

 

If it's on a page refresh, yeah, a session variable sounds right if you are using PHP to do the image rotation (unless JS has sessions?). I've never used cookies myself, on account of users deleting them so often, and I just haven't really had a reason to use them.

How are things working out Jodi?