Seite 1 von 3

Countdown Code auf Grafik

Verfasst: Mo 28. Okt 2019, 13:43
von Butterblume
Hallo ihr
ich hab mal eine Frage, und zwar suche ich einen Countdown Code (weihnachten, halloween, usw) der auf einem Bild angezeigt wird, und ich das Bild beliebig austauschen kann! Quasi so wie beim Kalender!

Ich habe jetzt nur diesen Code

<script>
var eventdate = new Date("December 25, 2019 00:00:00 GMT");
d=new Date();
count=Math.floor((eventdate.getTime()-d.getTime())/1000);
count=Math.floor(count/(60*60*24));
document.write(count);
</script>


Kann man den irgendwie abändern??

Ich hätte es gern so,dass ich den Code innerhalb eines Textes AUF dem Bild setzten kann.

Quasi wie hier: In <script>
var eventdate = new Date("December 25, 2019 00:00:00 GMT");
d=new Date();
count=Math.floor((eventdate.getTime()-d.getTime())/1000);
count=Math.floor(count/(60*60*24));
document.write(count);
</script>
</b> Tage kommt der Weihnachtsmann und bringt Geschenke mit für Groß und Klein!

Grün sind die Tage...

Verstehst ihr was ich meine? Ich kann das immer schlecht erklären, zumindest möchte ich als Hintergrund ein Bild einfügen können?!

Vielleicht hat ja jemand eine Idee?!

Hier könnt ihr gucken https://www.weihnachtszauber.karins-poserbilder.de ist direkt unter den Engeln!

Re: Countdown Code auf Grafik

Verfasst: Mo 28. Okt 2019, 14:16
von goefi-chiangmai
Am besten machst du dir einen Div container mit dem gewünschten hintergrundsbild und posizionierst dier den cod ins bild

Re: Countdown Code auf Grafik

Verfasst: Mo 28. Okt 2019, 14:35
von Butterblume
Hmh... :E besteht wohl die Möglichkeit peter, dass du mir da beihilflich sein könntest? :oops: aber ich versuchs natürlich auch gern allein und würde mich dann hier wieder melden.

Aber erst einmal vielen dank für deine schnelle hilfe!

Ich hätte da mal ne überlegung, könnte man den kalender oder die uhr nicht dementprechend ändern? War jetzt nur so ein gedanke! :oops:

Also,

1. Ich mache erst einmal eine grafik,

2. Dann erstelle ich mir diesen div container,

3. Und wie soll ich den code dann da posizionieren? :oops: :E

Ich habe noch nie solch einen code geschrieben! :oops:

Re: Countdown Code auf Grafik

Verfasst: Mo 28. Okt 2019, 16:31
von Butterblume
Peter,ich habe da jetzt mal was probiert, aber das wird falsch sein! Hab ja solch einen code auch noch NIE geschrieben!

In <b>
<script>
var eventdate = new Date("December 25, 2019 00:00:00 GMT");
d=new Date();
count=Math.floor((eventdate.getTime()-d.getTime())/1000);
count=Math.floor(count/(60*60*24));
document.write(count);
</script></b> Tage kommt der Weihnachtsmann und bringt Geschenke mit für Groß und Klein!
<div id="bildtrbox">
<div id="txt"></div>

<Div> habe ich jetzt, aber das wird sicher falsch sein?!

https://www.test.karins-poserbilder.de/new%201.php


Hab keine Ahnung wie das geht! :oops:

Mir fällt auch gerade ein, dass man die Zahl auch einer anderen Schrift und Farbe anpassen kann! Ich sag ja, eigentlich wie bei der Uhr und dem Kalender!

Re: Countdown Code auf Grafik

Verfasst: Fr 1. Nov 2019, 21:12
von goefi-chiangmai
hat jetzt das mit dem anderen Thema zu tun und ist erledigt oder nicht?

Re: Countdown Code auf Grafik

Verfasst: Sa 2. Nov 2019, 08:25
von Butterblume
Ne, ist noch nicht erledigt. Aber macht man.... das andere thema scheint wichtig zu sein!

Birgit will es jetzt versuchen wenn sie Zeit hat!

Re: Countdown Code auf Grafik

Verfasst: Sa 2. Nov 2019, 14:19
von goefi-chiangmai
Ich fliege das Wochenende in die Schweiz, werde danach versuchen,
Poste bitte mal dein Countown Code (ORIGINAL) und das Bild wo Du als hintergrund willst

Re: Countdown Code auf Grafik

Verfasst: Sa 2. Nov 2019, 14:32
von Butterblume
Hallo peter,
ich habe nur den schnipsel den ich im anfangspost gesetzt habe.

Die grafik kann ich dir noch machen.

Wäre schön, wenn ich die grafik danach immer mal wieder ändern könnte wenn das möglich ist?!

Aber da du ja in die schweiz fliegst, muss ich mich jetzt mit der grafik nicht so beeilen. Wie lange bleibst du da?

Re: Countdown Code auf Grafik

Verfasst: Sa 2. Nov 2019, 23:01
von HTML-Laie
Hier mal eine Lösungsmöglichkeit:

CSS-Abschnitt für die DIV's --> hier kann man das Hintergrundbild angeben sowie für den eigentlichen Counter Schriftart, Größe und Farbe einstellen. Ebenso die Position des Textes kann geändert werden mit left und top.

Code: Alles auswählen

<style type="text/css">
<!--
.bgimg {
background-image: url('countdown219tcjdk.png');
width:675px;height:500px;
}
.counter {
font-familiy:sans;
font-size:24px;
color:white;
position: absolute;
left: 13% ;
top: 5%;
}
 =-->
</style>
Hier die beiden DIV-Container:

Code: Alles auswählen

<div class="bgimg">
<div class ="counter">
In <b>
<script>
var eventdate = new Date("December 25, 2019 00:00:00 GMT");
d=new Date();
count=Math.floor((eventdate.getTime()-d.getTime())/1000);
count=Math.floor(count/(60*60*24));
document.write(count);
</script></b> Tag(en) kommt der<br>Weihnachtsmann und <br>bringt Geschenke mit <br>für Groß und Klein!
</div>
</div>
LG Hape :)

Re: Countdown Code auf Grafik

Verfasst: So 3. Nov 2019, 08:33
von Butterblume
Guten morgen hape,
du bist echt ne Wucht! Vielen vielen dank!

:DA :DA :DA

Ich werds nachher gleich einfügen und mich dann noch einmal hier melden! Ich freu mich so....

Es macht doch viel aus wenn jemand Ahnung davon hat! :DA schön, bist echt nen Schatz