Webcam beelden afwisselend weergeven EN tegelijk refreshen
Ik heb een dubbel probleem... Ik wil twee webcambeelden afwisselend (om de 15 sec) weergeven. Terwijl het beeld zichtbaar is, moet ook elke seconden dit beeld gerefreshed worden...
Ik haalde mijn inspiratie voor het script in dit topic:
http://www.phphulp.nl/php/forum/topic/fotos-automatisch-verwisselen/37209/2/
Omdat dit een oud topic is en omdat het eigenlijk nog een bijkomend probleem is, maak ik hier een nieuw topic.
Hierbij mijn gebruikte script:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?
<script type="text/javascript">
var imgArray = new Array('http://webcam.radiostar.be:88/CGIProxy.fcgi?cmd=snapPicture2&usr=website&pwd=live','http://webcam2.radiostar.be:89/CGIProxy.fcgi?cmd=snapPicture2&usr=website&pwd=live'); //etc.
var curPos = 0;
function imgRotate() {
if (curPos < imgArray.length - 1)
curPos += 1;
else curPos = 0;
if (typeof imgArray[curPos] == 'string')
imgArray[curPos] = CacheImage(imgArray[curPos]);
document.getElementsById("foto").src = imgArray[curPos].src;
}
function CacheImage(src) {
var imgObj = new Image();
imgObj.src = src;
return imgObj;
}
</script>
?>
<script type="text/javascript">
var imgArray = new Array('http://webcam.radiostar.be:88/CGIProxy.fcgi?cmd=snapPicture2&usr=website&pwd=live','http://webcam2.radiostar.be:89/CGIProxy.fcgi?cmd=snapPicture2&usr=website&pwd=live'); //etc.
var curPos = 0;
function imgRotate() {
if (curPos < imgArray.length - 1)
curPos += 1;
else curPos = 0;
if (typeof imgArray[curPos] == 'string')
imgArray[curPos] = CacheImage(imgArray[curPos]);
document.getElementsById("foto").src = imgArray[curPos].src;
}
function CacheImage(src) {
var imgObj = new Image();
imgObj.src = src;
return imgObj;
}
</script>
?>
En dan om de afbeelding op te roepen:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<?
<img id="foto" src="" alt="Webcam" onload="setTimeout(function() {src = src.substring(0, (src.lastIndexOf('t=')+2))+(new Date()).getTime()}, 1000)" onerror="setTimeout(function() {src = src.substring(0, (src.lastIndexOf('t=')+2))+(new Date()).getTime()}, 5000)" width="700" />
<script>
imgRotate();
setInterval("imgRotate();", 15000);
</script>
?>
<img id="foto" src="" alt="Webcam" onload="setTimeout(function() {src = src.substring(0, (src.lastIndexOf('t=')+2))+(new Date()).getTime()}, 1000)" onerror="setTimeout(function() {src = src.substring(0, (src.lastIndexOf('t=')+2))+(new Date()).getTime()}, 5000)" width="700" />
<script>
imgRotate();
setInterval("imgRotate();", 15000);
</script>
?>
Ik krijg deze foutmeldingen:
index.php:48 Uncaught TypeError: document.getElementsById is not a function
/h1437918228939:1 GET http://www.radiostar.be/h1437918228939 404 (Not Found)
/h1437918234194:1 GET http://www.radiostar.be/h1437918234194 404 (Not Found)
Iemand enig idee wat ik verkeerd doe... ? Alvast bedankt voor de hulp...
Damien
- SanThe - op 26/07/2015 17:16:54:
document.getElementById
ja klopt, had ik verkeerd gekopieerd uit vorige post... Bedankt voor de reactie :-)
Maar toch komen de beelden niet, de foutmeldingen komen om de seconde...
Damien
