Hallo, Besucher der Thread wurde 451 aufgerufen und enthält 0 Antworten

letzter Beitrag von Belarus am

[JS] Animierter Count Up

Aktiviere jetzt die 2-Faktor-Authentisierung für deinen Account und erhalte die Trophäe Auf der sicheren Seite.

Letzte Beiträge Ticker Box Content

    Hallo,

    nachfolgend einmal eine Möglichkeit wie Ihr einen so genannten "Count up" Counter auf euren Seiten verwirklichen könnt. Wie der Name schon sagt, werden hier die Werte nach oben gezählt und animiert wiedergeben. Also quasi wie ein Rückwärts laufender Countdown.


    Features

    • Leichte Integration
    • Einfaches anpassen an Deinen Style
    • Beliebig einsetzbare Font-Awesome (4.7) Icons
    • Quasi unendlich erweiterbar





    Demo

    Eine Live Demo dazu findest Du hier bei: Codepen.io: Count up

    Quellcode

    Da jQuery und Font-Awesome (4.7) bereits Standardgemäß enthalten sind, ist das einbinden dessen nicht notwendig. Auch die im folgenden Beispiel verwendete Schriftart Ubuntu ist optional, so dass diese entweder enthalten, angepasst oder gänzlich entfernt werden kann.


    Wichtig: Hier im Beispiel wurde die Flex-Methode genutzt. Ich empfehle jedoch das anpassen des folgenden Quellcodes an dem Layout-Expansion-Kit (von CLS-Design).

    Benutzung

    1. Quellcode wie o.a. nutzen oder, welches empfehlenswerter ist, an dem Layout-Expansion-Kit (von CLS-Design) anpassen.
    2. Font-Awesome Icons und Texte nach belieben editieren
    3. Style anpassen

    Lizenz

    Das "Layout-Expansion-Kit" unterliegt einer eigenen Lizenz von CLS-Design, so dass diese bitte zu beachten sind!

    Screenshot

    Beachte. dass dieses nur ein Screenshot ist. EIne Live Demo dazu findest Du hier bei: Codepen.io: Count up



    Viel Spaß damit ;)


    Gruss,
    Andreas

    • Gäste Informationen


    Hallo Gast,
    gefällt dir der Thread, willst du was dazu schreiben,
    dann melde dich bitte an.
    Hast du noch kein Benutzerkonto, dann bitte registriere dich, nach der Freischaltung kannst du das Forum uneingeschränkt nutzen.

    Dieses Thema enthält 0 weitere Beiträge, die nur für registrierte Benutzer sichtbar sind, bitte registriere dich oder melde dich an um diese lesen zu können.
  • Belarus

    Hat den Titel des Themas von „Animierter Count Up“ zu „[JS] Animierter Count Up“ geändert.

Jetzt mitmachen!

Du hast noch kein Benutzerkonto auf unserer Seite? Registriere dich kostenlos und nimm an unserer Community teil!