flashing text
by Евгений
HTML
<div class="flashing-text">some text here</div>
JavaScript
function flashingText (elems, color, pause, speed) {
color = color || '#fff';
speed = speed || 30;
pause = pause || 5000;
elems.forEach(function(elem) {
elem.innerHTML = elem.innerHTML.split('')
.map(function(letter) {
return '<span>' + letter + '</span>'
})
.join('');
neon(elem.querySelectorAll('span'), 0);
});
function neon (letters, currentId) {
if (letters.length === currentId) {
letters[currentId - 1].style.color = '';
setTimeout(function() {
neon(letters, 0);
}, pause);
return;
}
if (currentId > 0) {
letters[currentId - 1].style.color = '';
}
letters[currentId].style.color = color;
setTimeout(function() {
neon(letters, ++currentId);
}, speed);
}
}
flashingText(document.querySelectorAll('.flashing-text'))