Javascript voor multi refresh webcams

[jjwonline]

Javascript multi refresh webcam

Ik heb een website in wordpress gemaakt.

Nu wil ik 8 webcams tonen, van andere website's, maar deze ook automatisch laten vernieuwen.

Ik heb het volgende javascript en dat werkt prima met 1 webcam.
Zodra ik er meerdere neerzet refresht alleen de onderste.

HELP!

<script type="text/javascript" language="javascript">// <![CDATA[
var refreshrate=3; //SECONDS BETWEEN REFRESH
var image="http://www.tijsknop.nl/webcam/output.jpg"; //IMAGE NAME
var imgheight=480; //IMAGE HEIGHT
var imgwidth=640; //IMAGE WIDTH
function refresh(){
document.images["pic"].src=image+"?"+new Date();
setTimeout('refresh()', refreshrate*1000);}
document.write('<IMG SRC="'+image+'" ALT="Alternate Text" NAME="pic" ID="pic" WIDTH="'+imgwidth+'" HEIGHT="'+imgheight+'" STYLE="border: 1px solid Black;">');
if(document.images)window.onload=refresh;
// ]]&gt;</script>

 

[NewbiProgrammer]

Beste jjwoonline,

Je haalt nu één plaatje op en vervangt de html. Je zult een for-loop moeten maken waarin je de html veranderd per afbeelding.

var refreshrate=3000; //SECONDS BETWEEN REFRESH
var imagesrc="http://www.tijsknop.nl/webcam/output.jpg"; //IMAGE NAME
var imgheight=480; //IMAGE HEIGHT
var imgwidth=640; //IMAGE WIDTH

function refresh(){
   var images = document.images; //een lijst met alle afbeeldingen op de html-pagina.
   for(var i = 0; i < images.length - 1; i++) { //voor elke afbeelding.
      // hier moet je de veranderingen doorvoeren.
      setTimeout(veranderAfbeelding(images[i]), refreshrate); //misschien zoiets? Ik ben geen ster in javascript :)
   }
}

//we veranderen de afbeelding's src en zetten de style (css) attributen height en width met nieuwe waardes. 
function veranderAfbeelding(var image) {
    image.src = imagesrc+"?"+new Date().getMilliseconds();
    image.style.height = imgheight + 'px';
    image.style.width  = imgwidth + 'px';
}

// Let op, in dit stukje code ga ik ervan uit dat je geen andere afbeeldingen op je pagina hebt. De document.images methode geeft namelijk alle afbeeldingen die in je html-pagina staan.

if(document.images)window.onload=refresh;

Er kunnen enkele fouten in de code zitten. Ik ben namelijk geen javascript-programmeur.

Groet,
NewbiProgrammer

 

[jjwonline]

Helaas, het lukt mij niet ....

Bedankt voor je hulp in ieder geval!

 

[KwarK]

Ik heb je vraag verplaatst / samengevoegd vanuit Java naar Javascript