Refreshing image only

[glucarelli]

I would like to use a banner from http://www.wunderground.com
this banner display the time end the T° from any location you want.
The problem is that we have to refresh the page every time to display correct time.
Is the a way with javascript to just refresh the image and not the entire page ?
Any advice would be helpfull
Regards

[djr33]

This is an interesting question.

I'm not sure of the exact answer.

I believe it should be possible... use:
document.Images['name'].src = 'new.src';
(I think).

However, refreshing to the same src wouldn't reload it, if that image is changing (in the case of a dynamic image), unless you did somehting like added a random number to the end of it-- 'new.src?rand=324399' so the browser would think it's new. (That syntax gives php and other server side languages a value for the variable 'rand', and can actually be used for things in images.... but at the moment, it's just a little workaround). Actual properties of caching/reloading are up to the browser.
As for using a list and different images changing from time to time, that should be just fine.

[blm126]

Well, ddjr33 is right.However, I would recommend Flash or similar for this purpose. Or maybe even a javascript clock to keep the count going in plain text over the image. I think both of those are better options that constantly reloading an image.

[mburt]

Especially for people with dial-up internet. I had a program which would reload the page for a dynamic textarea... as you can tell, that didn't go so well My browser completely froze up after 10 seconds. Flash I think would be your best bet.

[djr33]

Certainly include some kind of delay. Since the question wasn't specific and this isn't my area, really, I just gave the basic code needed to change it, not keep track of how often.

I don't see why flash would be needed in this case.

[glucarelli]

Thank you for all yours answers

I'm looking for script used to refresh webcam to try to adapt it to my situation.
Still searching....

[djr33]

What? A webcam script would almost certainly be a plug in with streaming media, generated in a complex way as it must be live from the camera.... this isn't just a simple javascript method.
I'm confused.

[glucarelli]

And what about this code

the code (part 1)

<script language="JavaScript" type="text/javascript">
<!--

// original code by jovino
// � 2001 jovino
// all rights reserved

// MODIFICATION 1 & 2
// the following variables are used to customize the web cam
// the camImage variable can be an absolute or local path to the file
// make sure the camImage variable is quoted
// and the refreshIntervalSeconds variable is not

var camImage = 'webcam.jpg';
var refreshIntervalSeconds = 60;

// that�s all the javascript you need to customize!!
// please do not modify any of the script below this line
// there are no user serviceable parts inside

var secondsLeft = refreshIntervalSeconds;

function startClock() {
  if (secondsLeft > 0) {
    if (secondsLeft < 10) {
      document.webCam.timer.value = '0' + secondsLeft;
    } else {
      document.webCam.timer.value = secondsLeft;
    }
    secondsLeft = secondsLeft - 1
    timerID = setTimeout('startClock()', 1000);
  } else {
  date = new Date();
  imageNumber = date.getTime();
  document.webCamImage.src = camImage + '?' + imageNumber;
  secondsLeft = refreshIntervalSeconds;
  startClock();
  }
}
// -->
</script>

 
the code (part 2)

Place this image tag somewhere on your HTML page. Leave the question mark at the end of the image source because it is for non-caching trickery. If you have a different sized image, make sure you change the width and height attributes. Also make sure that your image src is correct for your webcam image.

<img src="webcam.gif?" name="webCamImage" alt="web cam" title="web cam" width="320" height="240" border="0">

 
the code (part 3)

This mini-form is for the countdown timer. Omitting this code, you will give you JavaScript errors unless you either make the timer element type="hidden" or you further modify the portion of the javaScript that displays the timer. See the instructions below for information on modifying this script.

<form name="webCam" action="#">
Refresh in: <input type="text" name="timer" size="2"> seconds.
</form>

 
the code (part 4)

To make the whole thing go, you need to add an onLoad atribute to the <body> tag. Your code should look something like this:

<body onLoad="startClock()">

[jscheuer1]

Did you try it? If it works, there is your answer. For simply refreshing an image, this works:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

</head>
<body>
<img name="updater" src="some.jpg?var1=0">
<script type="text/javascript">
function update_it(){
var count=document.images.updater.src.toString(16).split('=')[1]*1;
document.images.updater.src='some.jpg?var1='+[count+1];
}
setInterval("update_it()",5000);
</script>
</body>
</html>

Notes: Image name in green must appear both places in the code. The red 5000 is for every five seconds, adjust as needed/desired. If the image is large, be kind to dial-up users and have a long interval. The time between refreshes should be at least enough time for the image to load, preferably twice the load time for the image.

[glucarelli]

Thank you very much John your code work fine i've adjusted the interval update to 60 seconds.

For your question i've tried the code but on first refresh http://www.wunderground.com returns an invalid link