If you've seen my webpage, you've discovered that I don't know much about writing code.
I've been messing with a simple bit of Java script and can't get something to work.
Below is the code that refreshes my webcam image. I would like to have the ability to add a second webcam image next to the first one and I would like for it to refresh too.
I have been able to add the second webcam image. That's no problem, but when I do, neither image refreshes. I've tried a bunch of stuff, but clearly don't understand enough to make it work.
The code:
<HTML>
<HEAD>
</HEAD>
<BODY onLoad = "webcamRefresh()">
<script LANGUAGE="JavaScript">
<!-- hide
var refresh = 15;
var seconds = refresh;
function webcamRefresh()
{
document.form.counter.value = --seconds;
if (seconds <= 0)
{
var now = new Date();
var imageURL = "webcam.jpg" + "?" + now.getTime();
document.webcam.src = imageURL;
seconds = refresh;
}
refreshTimer = setTimeout("webcamRefresh()", 1000);
}
// -->
</SCRIPT>
<IMG NAME="webcam" SRC="webcam.jpg" WIDTH="512" HEIGHT="384">
<BR>
<FORM NAME="form">
<INPUT NAME="counter" TYPE="text" SIZE="2" VALUE BORDER=0> seconds until refresh
</FORM>
</BODY>
</HTML>
Full Version: HTML Question....
That only updates one image, webcam.jpg.
You should try something like... have your webcam software write to two images, webcam1.jpg and webcam2.jpg. a little bit of changes like this:
and things should work with 2 webcams running. It will refresh both at the same time.
You should try something like... have your webcam software write to two images, webcam1.jpg and webcam2.jpg. a little bit of changes like this:
CODE
<HTML><HEAD></HEAD>
<BODY onLoad = "webcamRefresh()">
<script LANGUAGE="JavaScript">
<!-- hide
var refresh = 15;
var seconds = refresh;
function webcamRefresh()
{
document.form.counter.value = --seconds;
if (seconds <= 0)
{
var now = new Date();
var imageURL1 = "webcam1.jpg" + "?" + now.getTime();
var imageURL2 = "webcam2.jpg" + "?" + now.getTime();
document.webcam1.src = imageURL1;
document.webcam2.src = imageURL2;
seconds = refresh;
}
refreshTimer = setTimeout("webcamRefresh()", 1000);
}
// -->
</SCRIPT>
<IMG NAME="webcam1" SRC="webcam1.jpg" WIDTH="512" HEIGHT="384">
<IMG NAME="webcam2" SRC="webcam2.jpg" WIDTH="512" HEIGHT="384">
<BR>
<FORM NAME="form">
<INPUT NAME="counter" TYPE="text" SIZE="2" VALUE BORDER=0> seconds until refresh
</FORM>
</BODY></HTML>
<BODY onLoad = "webcamRefresh()">
<script LANGUAGE="JavaScript">
<!-- hide
var refresh = 15;
var seconds = refresh;
function webcamRefresh()
{
document.form.counter.value = --seconds;
if (seconds <= 0)
{
var now = new Date();
var imageURL1 = "webcam1.jpg" + "?" + now.getTime();
var imageURL2 = "webcam2.jpg" + "?" + now.getTime();
document.webcam1.src = imageURL1;
document.webcam2.src = imageURL2;
seconds = refresh;
}
refreshTimer = setTimeout("webcamRefresh()", 1000);
}
// -->
</SCRIPT>
<IMG NAME="webcam1" SRC="webcam1.jpg" WIDTH="512" HEIGHT="384">
<IMG NAME="webcam2" SRC="webcam2.jpg" WIDTH="512" HEIGHT="384">
<BR>
<FORM NAME="form">
<INPUT NAME="counter" TYPE="text" SIZE="2" VALUE BORDER=0> seconds until refresh
</FORM>
</BODY></HTML>
and things should work with 2 webcams running. It will refresh both at the same time.
I've tried mods very close to what you've done there, but I'm not sure it was exact.
I'll play with it.
My primary webcam image is named "webcam.jpg", not "webcam1.jpg". My second cam is named "webcam2.jpg", as you suggested.
Do you think it will matter?
I'll play with it.
My primary webcam image is named "webcam.jpg", not "webcam1.jpg". My second cam is named "webcam2.jpg", as you suggested.
Do you think it will matter?
That did it.
Thanks.
I had been pretty close a couple of times, but......well, you now, I'm not a code writer.
Thanks.
I had been pretty close a couple of times, but......well, you now, I'm not a code writer.
Joe, one suggestion:
Add a BORDER=0 to your IMG tags. Right now you get a border around the linked images at the bottom of the page.
And here's some logo's for you. Take one, take them all.
Add a BORDER=0 to your IMG tags. Right now you get a border around the linked images at the bottom of the page.
And here's some logo's for you. Take one, take them all.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.