Frage Zeitbalken mit JavaScript

[laptop45276]

Code:
<table style="border: solid 3px #000000; text-align: middle; background: #32CD32; padding: 2px; font-size:20px;" max-width="1300" cellspacing="1" cellpadding="1">
<tbody><tr>
<td width="1%"><b>08:00</b></td>
<td width="99%">
<div style="width: 99%; padding: 1px; border:2px solid #000000;">
<script>
var StartDatum = "March 13, 2022 09:35:00"; // Format: Monat Tag, Jahr (englische Monatsnamen verwenden!)
var EndDatum = "March 13, 2022 09:37:00";

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);
Prozentx = Prozent.replace (/\./gi, ",");
if (Prozent > 100) Prozentx = 100;
if (Prozent < 0 ) Prozentx = 0;
if (Prozent >= 0.001) Prozentx >= 0.001;
document.write("<div style= 'max-width: " + Prozent + "% ; height: 30px; background: #ffffff; text-align:right; padding: 1px; font-size:24px;'><b>" + Prozentx + "%&nbsp;So,&nbsp;13.03.22&nbsp;</b></div>");
</script>5
</div>
<td width="1%"><b>13:00</b></td>
<td width="99%">
</tr>
</tbody></table>

Das Problem ist, wenn das Startdatum noch nicht begonnen hat, zeigt er folgendes an:



Aber es müsste so aussehen:



Habe es mit etlichen versucht:

if (Prozent > 0 ) Prozentx = 0; oder if (Prozent <= 0 ) Prozentx = 0;
Aber der Balken ist immer gefüllt. Wenn aber das Startdatum beginnt, dann beginnt er sich zufüllen.

Wenn ich folgendes nehme:
if (Prozent = 0) Prozentx = 0; zeigt er folgendes an und die Prozente zählen runter bis 0.
Und erst dann beginnt es mit 0,01% und der Balken füllt sich.


Hat jemand eine Idee?

 

[sveka]

Bitte mal den Code mit Code-TAG posten. Zu finden hinter den 3 Punkten im Editor und dann </>. Es lässt sich sonst immer sehr schwer lesen. Danke

 

[laptop45276]

Erstmal danke für die Antwort.

Der Code den ich gepostet habe, befindet sich in einem "HMTL-Fenster".

Die komplette Seite zuposten, wäre wahrscheinlich viel zulang. Da der obengenannte Code, insgesamt 7 mal vorkommt.

Die Seite sieht so aus: https://counteruhr.info/tag.html

 

[laptop45276]

Danke dir.

Ich habe meine Seite ja mal gepostet. Jeder Balken steht für ein Tag, und jeder Balken ist mit HMTL eingebettet oder wie das genau heißt.

Deinen Vorschlag habe ich mal auf eine Seite eingefügt, und leider ist es überhaupt nicht das, was ich mir vorstelle :-( Siehe: https://counteruhr.info/Seite1.html

Ich benutze ein WYSIWYG Web Builder

 

[laptop45276]

Trotzdem Danke.

Aber eigentlich wollte ich die Seite nicht komplett auf bzw. umbauen.

Dachte, das bei meinem ersten Code, vielleicht ein Zeichen falsch ist.

 

[basti1012]

Ich würde deine ganze Seite umbauen.
Die ganzen iFrames löschen und mit dem Code von @Sempervivum tauschen.
IFrames/Frames ist nicht mehr up to Date und nutzt man eigentlich nicht mehr.
Dann ist Tabellenlayout hier auch falsch , genauso wie width Attributen usw...
Vielleicht wäre hier <grogress> besser geeignet.

Siehe mal hier https://validator.w3.org/nu/?doc=https://counteruhr.info/
dann siehst du, was alles falsch ist.

Wenn du das umbauen möchtest, helfen wir dir gerne