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

letzter Beitrag von Belarus am

[JS] Word Changer

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

    Hallo,


    hier möchte ich euch einmal zweigen wie Ihr mit wenig Quellcode einen so genannten Word-Changer erstellen könnt, welche für diverse Zwecke eingesetzt werden kann. Dieser Word-Changer kann z.B. in einem Nachrichtenportal, eine Entwicklerseite oder auch eine Portfolio-Seite genutzt werden. Beispielsweise bestehen die Worte: "Ich bin ein" auf welchen folglich Worte wie "Entwickler" oder "Fanatiker" nach und nach aus dem Array animiert eingeblendet und damit "Ich bin ein Entwickler" und "Ich bin ein Fanatiker" ausgegeben werden ;)


    Features

    • Animierter Word-Changer
    • Einstellbare Animierungsart- und Dauer
    • Individuell an Deinen Style anpassbar






    Demo


    Eine Live Demo in der WCS ist leider nicht vorhanden. Allerdings ist ein Codebeispiel vorhanden: Codepen.io: [JS] Word Changer ;)

    Quellcode

    Dieser BBCode ist nur für Mitglieder sichtbar! - Um den BBCode nutzen zu können Loggen Sie sich bitte ein oder Registrieren Sie sich.
    Dieser BBCode ist nur für Mitglieder sichtbar! - Um den BBCode nutzen zu können Loggen Sie sich bitte ein oder Registrieren Sie sich.

    Benutzung

    1. HTML und jQuery Quellcode in einer Box, einer Seite oder aber im Template einfügen
    2. HTML Code im ersten <span>-Element und im jQuery Quellcode zwischen var words = [ ........ ] anpassen.
      Beachte bitte, dass hinter dem letzten Eintrag der Auflistung kein Komma gesetzt werden darf!
    3. Text per CSS nach eigenen Wünschen gestalten.
    4. Fertig!


    Im übrigen harmoniert der Word-Changer auch sehr schön als Seitentitel im TopBarMenu ;)

    Lizenz

    Copyleft oder mit anderen Worten, macht damit was Ihr wollt ;)

    Screenshots




    Gruss,
    Andreas

    • Gäste Informationen
    Hallo,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.

Jetzt mitmachen!

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