Zur Navigation

Texteffekt [2]

11 Anunnaki (Gast)

Hallo Jörg

Danke für deine Antwort!
Das Ganze funktioniert genau so, wie ich mir das gewünscht habe. Echt genial. Vielen vielen Dank dafür!

Ich habe mir schon gedacht, dass das ganze so ähnlich wie beim anderen Beispiel funktionieren könnte und ich habe mich auch daran versucht, dies umzusetzen, jedoch fehlen mir einfach zur Zeit noch die Kenntnisse und daher habe ich es natürlich nicht geschafft. Bin immer noch voll und ganz mit html und CSS beschäftigt.

Nochmals Danke für deine Hilfe! Finde ich äußerst nett von dir, dass du mir so geholfen hast. Wünsche dir noch einen schönen Tag

08.12.2015 10:55

... 10 Monate später ...

12 Anunnaki (Gast)

Hallo Jörg,

Ich möchte dieses Thema noch einmal aufwärmen, denn ich würde gerne wissen, wie man mehrere solche Texteffekte auf einer Seite unterbringt.
Ich habe in den letzten Tagen immer wieder mal versucht, das Ganze zu lösen, aber es klappt gar nicht.
Mein " erfolgreichster " Versuch ist dieser hier:
http://anunnaki.serverma.de/Flapper

Könntest du mir bitte mitteilen, wie ich beispielsweise zwei solche Texteffekte auf einer Seite anzeigen lassen kann?
Wann sollte ich in der Lage sein, das ganze selbst auf drei oder vier Texteffekte zu erweitern.
Wäre klasse, wenn Du mir die Lösung aufzeigen könntest. Es macht auch nichts, wenn es länger mit einer Antwort dauert. Vielen Dank schonmal.

27.10.2016 14:02

13 Jörg Kruse

Am besten geht das über eine Funktion, an welche die ID des Anzeigebereichs sowie das Textarray übergeben werden kann. Die überflüssigen Anweisungen der Demo-Version habe ich mal entfernt - mehr als das hier braucht es nicht:

<script>
$(document).ready(function() {
    function startFlapper(id, arrTexts)
    {
        var $header_display = $('#' + id);
        $header_display.flapper({
            width: 10,
            chars_preset: 'alpha'
        });
        (function recurse(counter) {
            var text = arrTexts[counter];
            $header_display.val(text).change();
            delete arrTexts[counter];
            arrTexts.push(text);
            setTimeout(function() {
                recurse(counter + 1);
            }, 4000);
        })(0);
    }
    startFlapper(
        'header_display',
        [ 'MONTAG', 'DIENSTAG', 'MITTWOCH', 'DONNERSTAG', 'FREITAG', 'SAMSTAG', 'SONNTAG' ]
    );
    startFlapper(
        'header2_display',
        [ 'EINS', 'ZWEI', 'DREI', 'VIER' ]
    );
});
</script>

Ggf. kann man die Argumentliste der Funktion auch noch erweitern, z.B. für eine Breitenangabe der Buchstaben

language="javascript" ist übigens völlig veraltet - bitte nicht mehr verwenden. In HTML 5 braucht das <script> Element keinen Zusatz wie language oder type.

27.10.2016 16:33 | geändert: 27.10.2016 16:33

14 Anunnaki (Gast)

Hallo Jörg,


vielen vielen Dank für diese geniale Lösung! Ich bin begeistert! Das ist viel besser, als ich erhofft hatte. Toll, dass du auch die überflüssigen Anweisungen von der Demo-Version entfernt hast.
Dass language="javascript" veraltet ist, habe ich schon gewusst, jedoch habe ich mir gedacht, dass das auch nichts ausmacht, wenn man das stehen lässt. Ist aber natürlich sauber, ohne diese Angabe. Ich hoffe, dass ich daran denke, dass in Zukunft wegzulassen.

Nochmals vielen Dank, dass Du dich mit meinem Problem auseinandergesetzt und mir so sehr geholfen hast!

Ein tolles Wochenende wünsche ich dir!

28.10.2016 12:28

Beitrag schreiben (als Gast)

Die Antwort wird nach der Überprüfung durch einen Moderator freigeschaltet.





[BBCode-Hilfe]