Countdown bis Datum "x"

26.01.2022 09:11
#1 Countdown bis Datum "x"
avatar
Mitglied

Hallo,
ich würde unseren Usern gerne einen Tageszähler anbieten den sie in ihre Signatur einbinden könnten. Als Ergebnis sollte in der Signatur die verbleibende Anzahl Tage bis zum geplanten Anreisedatum angezeigt werden (idealerweise mit Eingabemöglichkeit zum Ziel der Reise)
jemand ne Idee?
Vielen Dank
LG Winne


 Antworten

 Beitrag melden
26.01.2022 13:17
avatar  Ingmar
#2 RE: Countdown bis Datum "x"
avatar
Technik

Am einfachsten suchst du dir dafür einen Anbieter von Countdown-Widgets aus.

Z.B. diesen hier:
https://www.timeanddate.com/clocks/freecountdown.html

Dieser gibt dir dann einen Code zum einbinden. Der sieht z.B. so aus:

1
2
3
 

<iframe src="https://free.timeanddate.com/countdown/i868e1sf/n37/cf12/cm0/cu4/ct0/cs0/ca0/cr0/ss0/cac000/cpc000/pcfff/tcfff/fs100/szw320/szh135/tatTime%20left%20to%20Event%20in/tac000/tptTime%20since%20Event%20started%20in/tpc000/mac000/mpc000/iso2022-01-27T00:00:00" allowtransparency="true" frameborder="0" width="180" height="69"></iframe>
 
 



Wie du siehst, enthält dieser das Datum als Parameter:
<iframe src="https://free.timeanddate.com/countdown/i868e1sf/n37/cf12/cm0/cu4/ct0/cs0/ca0/cr0/ss0/cac000/cpc000/pcfff/tcfff/fs100/szw320/szh135/tatTime%20left%20to%20Event%20in/tac000/tptTime%20since%20Event%20started%20in/tpc000/mac000/mpc000/iso2022-02-27T00:00:00" allowtransparency="true" frameborder="0" width="180" height="69"></iframe>

Jetzt erstellst du einen Forencode:

Ersetze [countdown] ... [/countdown]
mit

1
 
<iframe src="https://free.timeanddate.com/countdown/i868e1sf/n37/cf12/cm0/cu4/ct0/cs0/ca0/cr0/ss0/cac000/cpc000/pcfff/tcfff/fs100/szw320/szh135/tatTime%20left%20to%20Event%20in/tac000/tptTime%20since%20Event%20started%20in/tpc000/mac000/mpc000/iso
 


...

1
 
T00:00:00" allowtransparency="true" frameborder="0" width="180" height="69"></iframe>
 



Dann können deine Mitglieder z.B. so

1
 
[countdown]2022-02-27[/countdown]
 


einen Countdown einfügen.

Viele Grüße,
Ingmar


 Technik · Homepagemodules.de · Miranus GmbH

 Antworten

 Beitrag melden
27.01.2022 13:03
#3 RE: Countdown bis Datum "x"
avatar
Mitglied

Herzlichen Dank Ingmar,
hat prima geklappt, vielen Dank für die Unterstützung!





das einzige was etwas stört ist das Datumsformat, aber egal - der Counter funktioniert!


 Antworten

 Beitrag melden
28.01.2022 18:02
#4 RE: Countdown bis Datum "x"
l2
Mitglied

hallo,

man findet in diesem Forum soviele Anregungen, da will ich mich mal mit diesem Script revanchieren.
<script>


window.addEventListener("DOMContentLoaded", function () {
l2b_test=true;
l2b_ticker('span.ticker');
l2b_ticker('.xquoteable i');
l2b_ticker('.msignature i');
l2b_ticker('span.countdown');
l2b_ticker('.msignature span.ticker');
});

l2b_ticker= function(selektor) { //* ..ticker

var tk=document.querySelectorAll(selektor);
var heute=new Date();
var regexp = /(\d+)\.(\d+)\.(\d+)\s(.+)\b/;
// 3 Zahlen, space, und Rest

var s="Info:\nregExp: " +regexp
+"\nselektor: "+selektor;

for (var t=0;tk && t< tk.length;t++) {
var content=tk[t].innerHTML;
s+="\n\ncontent: "+content;
if (content && content.length) {
var r=regexp.exec(content);
if (r) {
s+="\ntt:"+r[1];
s+="\nmm:"+r[2];
s+="\njj:"+r[3];
s+="\ntxt:"+r[4];
if (r.length > 3) {
var d=new Date(r[3],r[2]-1,r[1]);
s+="\nDate erkannt: "+d;
if (! isNaN(d) ){
var diff_msec= heute.getTime() - d.getTime();
var diff_tage=Math.floor(diff_msec/(24*60*60*1000));
var df=(" "+Math.abs(diff_tage)).bold();
s+="\ndiff_tage: "+diff_tage+" "+df;
var neu =diff_tage==0 ? "heute: ".bold() :
diff_tage > 0 ? ("seit "+df+" Tage(n) vorbei: ")
: ("noch"+df+" Tage(n) bis: ");
tk[t].innerHTML=neu+d.getDate()+'.'+(d.getMonth()+1)+'.'+d.getFullYear()
+' '+r[4];
}
}
}
}
}
if( l2b_test) alert(s);
} // ticker()
</script>

ausprobiieren lässt es sich z. B. mal mit diesem code. Der Einfachheit halber habe ich ein [i] benutzt, so muss man nicht extra zum testen ein BBC-code in der iconbar definieren. Klar, dass das alert() und und die Zeilen die den String s zusammenbauen rausnehmen kann.

1
2
3
4
5
6
7
8
9
10
11
 

 
[i]25.12.2022 erster Weihnachtstag[/i]
[mark=cyan][i] 26.12.2021 [blau][i]zweiter[/i] Weihnachtstag[/i][/blau][/mark]
[center][i]28.1.2022 heute?[/i][/center]
[i],, 29.Feb.2022 Schaltjahr?[/i]
[i],, 29.2.2022 Schaltjahr?[/i]
[i]2022.Feb was hier [/i]
[i]abc 1.5.2022 [u]erster Mai[/u][/i]
 

 





... würde es „Fussball spielen” heissen

vG Bernd‍

 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!