Javascript – How to Make an Image on a Page Refresh Every N Seconds

Here’s a minimal HTML page that will do this. Note that in Firefox I’ve found it doesn’t work for time intervals less than 5 seconds.

Notice that we add a random element to the end of the image URL on each refresh to get around any caching.

<html>
<head>
<script>
	function refreshcam(){
		img = document.getElementById("cam");
		img.src="http://192.168.1.6:8080/cam.jpg?rand=" + Math.random();
	}
</script>
</head>
<body onload="window.setInterval(refreshcam, 5*1000);">
        <p>Welcome!</p>
        <img id="cam" src="http://192.168.1.6:8080/cam.jpg" />
</body>
</html>

Comments are closed.