DanH42 Posted August 30, 2009 Share Posted August 30, 2009 I have a webcam hooked up to the internet, with a page I haven't updated in years (at the time, I just copied the code from somewhere else). At the moment, the camera takes a new picture every 5 seconds, and saves it as 'webcam.jpg'. The page reloads every 9 seconds, giving you the new picture. However, this makes the entire page reload, and also erases the picture for a few seconds. Is there a way to use JavaScript (or anything else) to have just the image reload, but have the new image load over the old one, so there's never just a blank page?Here's the current code if it would help: <html><head><title>webcam</title><meta HTTP-EQUIV="Expires" CONTENT="Tue, 1 Jan 2008 01:00:00 GMT"><meta HTTP-EQUIV="Cache-Control" CONTENT="no-store, no-cache, must-revalidate, post-check=0, pre-check=0"><meta HTTP-EQUIV="Pragma" CONTENT="no-cache"><meta HTTP-EQUIV="REFRESH" CONTENT="9"></head><p align="center"><img src="webcam.jpg" CACHE="FALSE" width="640" height="480"></body></html> Link to comment Share on other sites More sharing options...
justsomeguy Posted August 31, 2009 Share Posted August 31, 2009 Give your image an ID first:<img id="webcam" src="webcam.jpg" ...then you can use this Javascript to refresh. This adds a parameter to the end to make sure it doesn't use a cached image. The setInterval function makes the code run every X milliseconds. function refresh_image(){ document.getElementById('webcam').src = 'webcam.jpg?_dc=' + (new Date).valueOf();}setInterval(refresh_image, 9000); Link to comment Share on other sites More sharing options...
DanH42 Posted August 31, 2009 Author Share Posted August 31, 2009 Thanks! That worked perfectly! Give your image an ID first:<img id="webcam" src="webcam.jpg" ...then you can use this Javascript to refresh. This adds a parameter to the end to make sure it doesn't use a cached image. The setInterval function makes the code run every X milliseconds.function refresh_image(){ document.getElementById('webcam').src = 'webcam.jpg?_dc=' + (new Date).valueOf();}setInterval(refresh_image, 9000); Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.