Chodzi o animowanie tekstu w taki sposób:
Jest napis i literka po literce zmienia się kolor, aż pokolorujemy cały napis, gdy to się stanie napis zaczyna powracać w taki sam sposób do poprzedniego koloru.
Napisałem swój kod, jednak nadal wolałbym jakiś gotowy plugin.
Kod wygląda tak:
var animates = new Array(); function start() { for (i=0; i < animates.length; i++) { animates[i].animate(); } setTimeout('start()', 100); } var animateText = function(id) { this.id = id; this.animated = new Array(); this.cut = function() { var text = $("#" + this.id).html(); this.animated['length'] = text.length; this.animated['eq'] = 0; this.animated['old'] = 'white'; $("#" + this.id).html(' '); for (i=0; i <= this.animated['length']; i++) { $("#" + this.id).append('<span style="display: inline;">' + text.slice(i, i+1) + '</span>'); } this.animate(); } this.animate = function() { var color = 'red'; if (this.animated['old'] == 'red') { color = 'white'; } if (this.animated['eq'] < this.animated['length']) { $("#" + this.id + " span:eq(" + this.animated['eq'] + ")").css('color', color); this.animated['eq']++; }else{ this.animated['old'] = color; this.animated['eq'] = 0; this.stop++; } } this.cut(); animates.push(this); } $(document).ready( function() { var obj = new animateText('regul'); start(); } );
Działać - działa...
Zna ktoś może plugin oferujący taką funkcjonalność?