- RU
- EN
ТТТ.js: jQuery плагин анимации текста
Рабочее название - TTT, или Тасующаяся Трансформация Текста.
Разработан по спецзаказу digital-агенства Contorra.
Этот плагин позволяет сменить один текст на другой посредством событий "клика" или "наведения" на сам объект, либо любой другой, с эффектом трансформации каждого символа. Каждый символ текущего текста двигается по кратчайшему пути в массиве символов своего типа (заглавные, строчные буквы, цифры, знаки пунктуации и прочие) и останавливается при достижении конечного результата. В результате мы наблюдаем, как из хаоса вращающихся символов постепенно проявляется заданный текст.
Демо:
Инструкция по установке:
- подключить jQuery
- скачать файл плагина (2 кб) или скопировать в примере выше и подключить после jQuery (следите, чтобы русские символы не перекодировались браузером при скачивании)
- добавить в html объект, содержащий текст, дата атрибут data-ttt-new с текстом к которому он будет трансформирован. Например: <div data-ttt-new="Будущий текст">Базовый текст</div>
- вызвать плагин TTT на обрабатываемый объект:
$(document).ready(function() {
$('div').ttt();
});
И все, по стандарту при наведении на этот объект, его текст сменится на новый, а при потере наведения - вернется на исходный, со скоростью 60fps.
Также сущесвует ряд настроек:
- задать объект для вызова события: 'btn':'селектор'
- задать тип события по клику: 'event':'click'
- скорость смены символов: 'fps':любое число кадров в секунду
Например:
$('div').ttt({
'btn':'div',
'event':'click',
'fps':15
});
Пользовательская функция callback в данной версии не реализована.
- - -
Эту страницу находят по запросам:
- плагин анимации текста
- плагин анимации wordpress
- красивая анимация текста
- анимация появления текста after effects
- анимация текста в after effects пресеты
- как установить плагин typemonkey
- текст анимация