Animierter Ladebalken mit Prozentangabe

X

xxxmike

Erfahrenes Mitglied
Hallo,
hab hier schon alles soweit durchsucht, aber so richtig bin ich leider nicht fündig geworden.

Ich möchte folgendes Realisieren.


Es soll beim öffnen einer Seite ein Ladebalken anfangen sich zu füllen will ich mal so sagen. Die Zeiten sind unterschiedlich, von sagen wir mal 30 Sekunden bis zum Beispiel 70 Sekunden.

Also so eine Art Counter, nur das hier nicht die Sekunden herunter gezählt werden sollen, sondern eben ein Ladebalken sich füllt.
Wenn möglich noch mit % Anzeige.

Ich danke schon mal für jeden Tipp und Hilfe
 
Das ist schon ein cooles Teil. Da ich leider nicht so fit mit Java ect. bin, wie mache ich das, dass die Fortschrittsanzeige los läuft ohne einen Button zu klicken. Dass heißt wenn die Seite aufgerufen wird.

DANKE schon mal
 
Hi,

du kannst die Anzeige im onload-Event des Dokuments starten.

Beispiel:
Code: 
<html>
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">

<script src="excanvas.js" type="text/javascript"></script>
<script src="qpCanvasProgressBar.js" type="text/javascript"></script>

<script type="text/javascript">
  <!--
window.onload = function(){
  objCanvas = new qpCanvas({
    id: 'canvas_id',
    width: 100,
    height: 100,
    segments: 20,
    segspace: 0.15,
    bgFull: '#258',
    bgMid: '#368',
    bgFullShow: 1,
    bgMidShow: 1,
    center: false,
    onComplete: function(){
    	// this ist verfügbar
    	alert("Fertig !");
    }
  });

  // Startet die Fortschrittsanzeige mit nachstehenden Parametern:
  // Dauer: 5 Sekunden, 20 Schritte, Aussenradius 30 Pixel, Innenradius 25 Pixel
  objCanvas.drawCircleByTimeAndSteps(5, 20, 30, 25);
};
 //-->
</script>
</head>
<body>
<canvas id="canvas_id"></canvas>
</body>
</html>

Weitere Informationen findest du auf der verlinkten Seite in meinem ersten Post.

Ciao
Quaese
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück