Szukałem, szukałem i nie znalazłem... może źle szukałem?
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ść?