Thursday, June 30, 2011

Web - How to Refresh Images

The trick behind AW television stations that use rotating jpgs is pretty simple in AW... but how about on webpages?  Unfortunately, there's nothing as simple as 'create picture' to manipulate images, but a snippet of Javascript should work just as well.

<IMG src="image_name.jpg" width="309" height="309" border="1" name="refresh">
<SCRIPT language="JavaScript" type="text/javascript">
var t = 120 // interval in seconds
image = "image_name.jpg" //name of the image
function Start() {
tmp = new Date();
tmp = "?"+tmp.getTime()
document.images["refresh"].src = image+tmp
setTimeout("Start()", t*1000)
// -->
<!-- Code End -->

I don't know much about Javascript, but I found this online and was able to re-purpose it down to what we'd find useful around here.  When we apply the code above to WTV, for example, the result is an image that refreshes... every 10 seconds.  Exactly what we coded, right!? :)

Just pop that into your page and replace the jpg source, and it should refresh the image every 10 seconds.  This is ideal for tv stations that want the slideshow to work on webpages, and it also has other applications (such as webcams).

No comments:

Post a Comment