I have the below code on our website which randomly displays one of five images when the page is opened or refreshed.

Is there a way to put back and forth arrows on the images so users can scroll through them?


<script type="text/javascript">
var total_images = 5;
var random_number = Math.floor((Math.random()*total_images));
var random_img = new Array();

random_img[0] = '<a href="page1.htm"><img src="images/indexpics/image1.jpg" border="0"></a>';
random_img[1] = '<a href="page2.htm"><img src="images/indexpics/image2.jpg" border="0"></a>';
random_img[2] = '<a href="page3.htm"><img src="images/indexpics/image3.jpg" border="0"></a>';
random_img[3] = '<a href="page4.htm"><img src="images/indexpics/image4.jpg" border="0"></a>';
random_img[4] = '<a href="page5.htm"><img src="images/indexpics/image5.jpg" border="0"></a>';