fx-rotate

Fx.Rotate: Анимация поворота элемента на MooTools

В бесконечных поисках на MooTools Forge мы нашли один небольшой аккуратный плагин Fx.Rotate, который позволяет крутить статический элемент. Fx.Rotate является расширением Fx класса MooTools и может крутить элемент через CSS, если это поддерживает браузер. Давайте посмотрим, как можно просто внедрить анимацию кручения на ваш сайт.

Посмотреть пример на davidwalsh.name

MooTools JavaScript

Сейчас рассмотрим, как инициировать и использовать плагин. Для этого введем новый класс элемента и просто его назначим через событие нажатия кнопки, которое запустит анимацию кручения элемента:

Когда DOM инициализирован, мы назначаем на событие click запуск анимации поворота с параметрами от 0 до 45 градусов. Этот класс супер маленький, так как является расширением Fx, в котором уже заложена логика анимации.

Класс MooTools

Мы не утверждаем, что такой код соответствует последним стандартам MooTools:

Пока этот код работает (что очень важно), мы предпочтем изменить класс следующим образом:

Просто не много реорганизации и никакого изменения логики.

Посмотреть пример на davidwalsh.name

Перевод статьи с davidwalsh.name

PS. У каждого порядочного вебмастера должен быть свой любимый железный конь. Например, чаще всего любят японцев, а из европейцев хороши немцы, итальянцы и французы с их Пежо. Вобщем, дело вкуса.


Оставить комментарий