Wie kann ich einen Countdown zu meiner Website hinzufügen?

...komplette Frage anzeigen

2 Antworten

Hallo Johanna,

für dieses Vorhaben benötigst du JavaScript, html und CSS.

JavaScript für die Funktion, also das Rücklaufen der Zahlen. html für das Grundgerüst und CSS für die Gestaltung deines Countdowns.

Gerne "programmiere" ich dir einen solchen Countdown, sage mir einfach wie er aussehen soll und was er machen soll. Sache von 5 Minuten ;-)

Ich würde dir dann hier den Code schicken und du kannst ihn ganz bequem in deine Websit einbauen - auch dabei helfe ich dir gerne weiter.

Beste Grüße, Hummel

Wow ein großes DANKESCHÖN! Das wäre uuunglaublich toll, da ich mich da wirklich nicht auskenne..

Ein ganz schlichter schwarzer Countdown würde schon genügen & er sollte bis zum 18.08.2015 gehen :) wenn ich jetzt richtig rechne sollte er 369 Tage haben :D

Ganz liebe grüße zurück und danke noch einmal! Johanna

0
@Johannanm

Hello again,

gebe mir mal ein paar Minuten, dann schicke ich dir hier den Code ;-)

Grüße, Hummel

1
@hummelxy

Servus,

hat etwas länger gedauert, als gedacht...

Binde diesen Code nun in deiner Website ein:

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
        var diff=31902742;
        var interval=true;
        $(document).ready(function(){
            if(interval){
                window.setInterval("calc(--diff)",1000);
            }
        });
        function calc(diff){
            if(diff>0){
                var tmp_diff=diff;
                var d=Math.floor(tmp_diff/86400);

                if(d<10){
                    d='0'+d;
                }
                tmp_diff-=d*86400;
                var h=Math.floor(tmp_diff/3600);
                if(h<10){
                    h='0'+h;
                }
                tmp_diff-=h*3600;
                var i=Math.floor(tmp_diff/60);
                if(i<10){
                    i='0'+i;
                }
                tmp_diff-=i*60;
                var s=tmp_diff;
                if(s<10){
                    s='0'+s;
                }

                $('#fall .countdown table tr:nth-child(1) td:nth-child(1)').text(d);
                $('#fall .countdown table tr:nth-child(1) td:nth-child(2)').text(h);
                $('#fall .countdown table tr:nth-child(1) td:nth-child(3)').text(i);
                $('#fall .countdown table tr:nth-child(1) td:nth-child(4)').text(s);
            }
            else{
                interval=false;
                $('#fall').html('<p class="et">Fertig!</p>');
            }
        }
    </script>
<div id="fall">
                <div class="countdown">
                    <table cellspacing="4">
                        <tbody>
                            <tr>
                                <td>369</td>
                                <td>05</td>
                                <td>52</td>
                                <td>22</td>
                            </tr>
                            <tr class="cdsmaller">
                                <td>Tage</td>
                                <td>Std</td>
                                <td>Min</td>
                                <td>Sek</td>
                            </tr>
                        </tbody>
                    </table>
                    <div class="clearer"></div>
                </div></div>

Ich habe das Design jetzt mal komplett außen vor gelassen. Gerne passe ich dir das aber noch an...

Hier hast du noch ein angwendetes Beispiel: http://jsfiddle.net/z55v856n/

Beste Grüße, Hummel

1
@hummelxy

Danke vielmals!!

Kann ich diesen Code jetzt einfach in einem Texrfeld einfügen und der Countdown erscheint? Irgendwie sehe ich immer noch den Code wenn ich das einfüge nicht den countdown..oh man würde ich mal etwas mehr davon verstehen :D

Liebste grüße

0

Hey Johannanm,

Du musst bei Jimdo das HTML Widget auf die gewünschte Seite einfügen, und dort dann den Code eingeben, welchen du von der Countdown Seite bekommen hast.

Hoffe diese Antwort hat dir geholfen.

Was möchtest Du wissen?