Zeitbalken

Dieses Script zeigt die vergangene Zeit mit einem farbigen Fortschrittsbalken an. Mit JavaScript oder PHP kann man die vergangene Zeit berechnen lassen und mit CSS wird dann der Fortschrittsbalken farbig angezeigt.

Beispiele:



Die Breite des Fortschrittsbalkens lässt sich mit Hilfe einer Tabelle von CSS optisch anpassen (width, max-width).

24.12.2017
24.12.2018

Fortschrittsbalken mit JavaScript

<div style="width: 100%; border:1px solid #0070DF;">

<script>
var StartDatum = "December 24, 2017"; // Format: Monat Tag, Jahr (englische Monatsnamen verwenden!)
var EndDatum  =  "December 24, 2018";

var Anfang = new Date(StartDatum).getTime();
var Prozent = Math.floor(((new Date().getTime() - Anfang) / (new Date(EndDatum).getTime() - Anfang)) * 100);
if (Prozent > 100) Prozent = 100;
if (Prozent < 1 ) Prozent = 0;
document.write("<div style='width: " + Prozent + "%; background: #AAD5FF; text-align: right;'>" + Prozent + "% <\/div>");
</script>

</div>

Fortschrittsbalken mit PHP

<div style="width: 100%; border:1px solid #0070DF;">

<?php
$StartDatum = mktime(0,0,0, 12, 24, 2017);
$EndDatum  =  mktime(0,0,0, 12, 24, 2018);

$Prozent = floor(((time() - $StartDatum) / ($EndDatum - $StartDatum)) * 100);
if ($Prozent > 100) $Prozent = 100;
if ($Prozent < 1 ) $Prozent = 0;
echo "<div style='width: " . $Prozent . "%; background: #AAD5FF; text-align: right;'>" . $Prozent . "% </div>";
?>

</div>

Tipps

Favicon erstellen - Ihr Logo in den Lesezeichen (Favoriten)
Das Favoriten Icon wird bei einem Bookmark in die Favoritenliste aufgenommen. Dort erscheint zukünftig die „gebookmarkte” Webseite mit einem eigenen Symbol.
Artikel über Checkboxen auswählen
Hier können Artikel (Bilder) ausgewählt werden die bestimmte Kriterien der Checkboxen erfüllen. Die Daten werden in einer CSV-Datei gespeichert und können individuell angepasst werden.
Mit dem PHPMailer E-Mails sicher versenden
Damit E-Mails sicher beim Empfänger ankommen und nicht irgendwo anders landen (Spamordner) oder sogar vom Provider abgelehnt werden nutzt man am besten eine fertige Mailer-Klasse wie den „PHPMailer”.
Diese Schlagwörter könnten Sie interessieren:
Zeitbalken Zeitansage Chatroom Zoom-Funktion Dateibrowser Zugriffsrechte Lokaler Webserver Key Codes Formulare Linkliste Event-Kalender Canvas Diashow MySQL Berechnungen PHP-Fehlermeldungen Zebra-Tabelle Zeichenkodierung Rahmen Veranstaltungsliste