Uhreffekt mittels Timestamp

Sasser

Erfahrenes Mitglied
Guten Tag!

Ich suche nach einer Möglichkeit, über einem Bild eine Art Fortschrittsanzeige zu erzeugen. Also ich möchte dem Script die Gesamtzeit im Timestampformat und die Endzeit im Timestampformat übergeben und eine Art Torte über einem Bild erzeugen, welche das sich nach und nach grünlich einfärbt, je näher man dem Ende kommt.

Gibt es sowas bereits als Vorlage oder etwas ähnliches?
 
Hi

hier mal ein Beispiel für eine Statusbar:
HTML:
<div style="width: 100px; height: 20px;">
  <div style="width: 1px; height: 10px; background-color: green;" id="statusbar"></div>
</div>
Javascript:
function status(time_per_pixel){
  obj = document.getElementById('statusbar');
  if( obj ){
    if( obj.style.width >= 100 )
      return false; //Fertig geladen
    obj.style.width = obj.style.width+1+"px"; //1% laden
  }
  setTimeout("status("+time_per_pixel+")",time_per_pixel); //Funktion erneut aufrufen
}
status(1300); //Jede 1300 Tausendstel Sekunde lädt 1%

Ist nicht getestet, sollte aber den Zweck erfüllen (ggf anpassen).

}
 
Hi,

eine etwas andere Möglichkeit einer Fortschrittsanzeige - mit Hilfe des Canvas-Elements.

Damit hatte ich vor einiger Zeit mal begonnen. Nachdem ich diesen Post gelesen habe, war ich wieder motiviert es zu Ende zu bringen.

Link: Fortschrittsanzeige

Ciao
Quaese
 
Zurück