Bild zeitlich aktualisieren

[Felix Riesterer]

Lieber JulianBaumueller,

es ist nicht besonders hilfreich, Dir mit Deinem originalen Posting selbst zu antworten, sodass zweimal dasselbe da steht... ein Versehen?

Wenn ich aber nun per JavaScript [...] dieses eine Bild in diesem Takt aktualisiert haben möchte [...]

Du benötigst in diesem Falle [ref:self812;javascript/objekte/window.htm#allgemeines@title=window].[ref:self812;javascript/objekte/window.htm#set_interval@title=setInterval()], in welches Du eine eigene Funktion hineinschreibst, die dann in dem von Dir festgelegten Zeitabstand aufgerufen wird.

<img src="kamerabild.jpg" id="kamerabild" width="300" height="300">

Du kannst das Bild über seine ID per JavaScript "anfassen". Das geht mit [ref:self812;javascript/objekte/document.htm#allgemeines@title=document].[ref:self812;javascript/objekte/document.htm#get_element_by_id@title=getElementById()]

Bauen wir einmal etwas zusammen:

<script type="text/javascript>//<![CDATA[

    function aktualisiere_kamerabild() {  
        // Refrenz auf das Bild-Elementobjekt  
        var bild = document.getElementById("kamerabild");  
  
        // Pfad zur Bilddatei mit URL-Parameter gegen Browser-Caching  
        var src = "http://www.example.org/kamerabild.jpg?time=";  
  
        // aktuelle Systemzeit in Millisekunden  
        var sekunden = new Date().getTime();  
  
        // neue Quelle dem Bild zuordnen  
        bild.src = src + sekunden;  
    }  
  
    // alle 1000 Millisekunden "aktualisiere_kamerabild" ausführen  
    window.setInterval(aktualisiere_kamerabild, 1000);

//]]></script>

Liebe Grüße,

Felix Riesterer.