Magic: CSS3-анимации с особыми эффектами

CSS3 дает нам действительно отличные свойства, с которыми можно поиграть и получить невероятные эффекты для своих веб-проектов. Поэтому сегодня мы хотим предложить вам набор CSS3-анимаций, которые был разработаны под вдохновением от animation.css.

Magic – это невероятные кросс-браузерные анимации, которые можно использовать в дизайн-проектах. Magic на данный момент находится в стадии бета-разработки, и вскоре можно ожидать появления большего числа эффектов.

Применение данных эффектов невероятно простое. Просто включите css-файл magic.css или минимизированную версию magic.min.css


Пример:

<link rel="stylesheet" href="yourpath/magic.css">

Стандартный CSS-тайминг:

.magictime {
-webkit-animation-duration: 1s;
-moz-animation-duration: 1s;
-o-animation-duration: 1s;
animation-duration: 1s;
}

Вы можете изменить время анимации путем настройки набора классов magictime:

.magictime {
-webkit-animation-duration: 3s;
-moz-animation-duration: 3s;
-o-animation-duration: 3s;
animation-duration: 3s;
}

Скачать | Демо