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:

Fortschrittsbalken mit JavaScript

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

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

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>

Mit Nachkommastellen

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

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

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

</div>

Fortschrittsbalken mit PHP

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

<?php
$StartDatum = mktime(0,0,0, 12, 24, 2021);
$EndDatum  =  mktime(0,0,0, 12, 24, 2022);

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

</div>

Mit Nachkommastellen

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

<?php
$StartDatum = mktime(0,0,0, 12, 24, 2021);
$EndDatum  =  mktime(0,0,0, 12, 24, 2022);

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

</div>

Tipps

Bilder in einer Datenbank-Tabelle speichern und ausgeben

Das Hochladen von Bildern in die Datenbank und die Anzeige mit PHP ist relativ einfach. Mit dem folgenden PHP-Code lädt der Benutzer die Bilder hoch, die dann sicher in die Datenbank-Tabelle gelangen.

Audio-Player

Mit diesem Audio-Player kann man Audio-Dateien über JavaScript steuern.

Floodsperre

Um das Flooden (= Zumüllen mit großen Mengen meist sinnlosen Inhalts) von Foren und Gästebüchern etc. zu erschweren oder um zu verhindern das nach dem absenden des Formulars und drücken der F5-Taste (Seite neu laden) die Daten nochmals eingetragen werden, kann die hier vorgestellte Floodsperre einen Schutz bieten.