How to display the image on the website
webcam.htm
- Deployed by PpcWebcamSetup
- PpcWebcam uploads this file together with each image, if set under the new HTML File parameter. While doing so, it replaces the #echo statement with the current date and time. Thus, the webpage displays the image with the date and time of upload. It works independently of a webserver, e.g. also on transfer directly to your local PC. The format of date and time is determined by the #config statement. You can adapt it and, of course, the style of webpage to your needs.
- User must allow META REFRESH in his browser
<html>
<head>
<meta http-equiv="refresh" content="10">
</head>
<body style="font-family: Arial,sans-serif;
font-size: smaller;
font-weight: bold;
color: gray;
background-color: silver;
text-align: center;">
<img src="webcamimage.jpg">
<br>
<!--#config timefmt="%m-%d-%Y %H:%M:%S" -->
<!--#echo var="DATE_LOCAL" -->
</body>
</html>
webcam2.html - Another solution
- Server side solution for displaying the date and time of image
- Browser reloads the image only when a new image file has been uploaded
- User must enable Java Script in his browser
- Webserver must support Server Side Includes (SSI)
<html>
<body>
<div style="text-align:center;">
<img src="webcamimage.jpg"><br>
<iframe name="frame1" src="lastmod.shtml" frameborder="0">
</iframe>
</div>
<script type="text/javascript">
setTimeout("start()",1000);
function start()
{
date = frame1.document.getElementById("lastmod").innerText;
setInterval("refresh()",3000);
}
function refresh()
{
frame1.location.reload();
if(date != frame1.document.getElementById("lastmod").innerText)
location.reload();
}
</script>
</body>
</html>
lastmod.shtml
<html>
<body>
<div id="lastmod" style="font-family:Arial,sans-serif; text-align:center;">
<!--#config timefmt="%m-%d-%Y %H:%M:%S" -->
<!--#flastmod virtual="webcamimage.jpg" -->
</div>
</body>
</html>
© 2006
Zone1