Random image with timed refresh
I'm needing to pull a random image from over 200 images so loading them all up front is not possible as the load time would be much too long. So I need something that will pull one randomly and then after a few seconds run again to load another image.
The JPG images are named 1.jpg, 2.jpg, 3.jpg, etc.
The plain javascript I have now requires that the whole page reloads to get the image to change. Below is the code I'm currently using:
<div id="header_image">
<script language="JavaScript" type="text/JavaScript">
function randomImg_m() {
var imgNum_m;
var imgNumMax_m = 210;
imgNum_m = Math.floor(Math.random() * imgNumMax_m) + 1;
return imgNum_m;
}
document.write ("<img src='/images/header/178x137/" + randomImg_m() + ".jpg' width='178' height='137' >");
</script>
</div>
Is there a better way to do this using jQuery?
Thanks in advance!
The JPG images are named 1.jpg, 2.jpg, 3.jpg, etc.
The plain javascript I have now requires that the whole page reloads to get the image to change. Below is the code I'm currently using:
<div id="header_image">
<script language="JavaScript" type="text/JavaScript">
function randomImg_m() {
var imgNum_m;
var imgNumMax_m = 210;
imgNum_m = Math.floor(Math.random() * imgNumMax_m) + 1;
return imgNum_m;
}
document.write ("<img src='/images/header/178x137/" + randomImg_m() + ".jpg' width='178' height='137' >");
</script>
</div>
Is there a better way to do this using jQuery?
Thanks in advance!