ТТТ: jQuery плагин анимации текста
Новая тема Написать ответ
# Пт Ноя 14, 2014 6:04 pmcontorra Зарег.: 13.11.2014 ; Сообщ.: 3Ответить с цитатой
Рабочее название - TTT, или Тасующаяся Трансформация Текста. Разработан по спецзаказу digital-агенства Contorra.

Этот плагин позволяет сменить один текст на другой посредством событий "клика" или "наведения" на сам объект, либо любой другой, с эффектом трансформации каждого символа. Каждый символ текущего текста двигается по кратчайшему пути в массиве символов своего типа (заглавные, строчные буквы, цифры, знаки пунктуации и прочие) и останавливается при достижении конечного результата. В результате мы наблюдаем, как из хаоса вращающихся символов постепенно проявляется заданный текст. Демо здесь.

Инструкция по установке:
подключить jQuery
скачать файл плагина (2 кб) или скопировать в примере выше и подключить после jQuery (следите, чтобы русские символы не перекодировались браузером при скачивании)
добавить в html объект, содержащий текст, дата атрибут data-ttt-new с текстом к которому он будет трансформирован. Например:
Код:
<div data-ttt-new="Будущий текст">Базовый текст</div>


вызвать плагин TTT на обрабатываемый объект:
Код:
$(document).ready(function() { $('div').ttt(); });


И все, по стандарту при наведении на этот объект, его текст сменится на новый, а при потере наведения - вернется на исходный, со скоростью 60 fps.

Также существует ряд настроек:
    задать объект для вызова события: 'btn':'селектор'
    задать тип события по клику: 'event':'click'
    скорость смены символов: 'fps':любое число кадров в секунду

Например:
Код:
$('div').ttt({
    'btn':'div',
    'event':'click',
    'fps':15
});


Пользовательская функция callback в данной версии не реализована.
# Сб Ноя 15, 2014 12:35 pmDentz Зарег.: 04.04.2014 ; Сообщ.: 2170Ответить с цитатой
contorra, для кого может быть полезен этот плагин?
# Сб Ноя 15, 2014 5:22 pmHello_Kitty Зарег.: 30.04.2007 ; Сообщ.: 10763Ответить с цитатой
Dentz, Yabuti это точно бы заинтересовало. :mrrgreen: Недавно он что-то мутил по этой теме. Он вообще любой фишке найдет применение. Недавно он спрашивал как задержать на странице пользователей. Ну вот эта фича бы задерживала живых людей, они бы наводили снова и снова, или кликали снова и снова, чтобы смотреть как преобразовывается текст.
# Вс Ноя 16, 2014 11:54 amashiko Зарег.: 02.08.2010 ; Сообщ.: 4127Ответить с цитатой
Цитата:
чтобы смотреть как преобразовывается текст.


Вот так? :mrrgreen:

Новая тема Написать ответ    ГЛАВНАЯ ~ ТЕХНИЧЕСКИЕ ВОПРОСЫ
 
Любое использование материалов, размещенных на ArmadaBoard.com, без разрешения владельцев ArmadaBoard.com запрещено.