На сайте ведутся работы!
Поэтому могут быть ошибки и недочеты. Приносим свои извинения и постараемся все исправить в ближайшее время.
AdBlock
Блокируйте рекламу. Просматривайте быстрее.
Adguard
Самый быстрый и легковесный блокировщик рекламы для браузеров.
Недавние обсуждения
Animate.css - сборка классных, кроссбраузерных анимаций для использования в ваших проектах. Все анимации используют возможности CSS3 и находятся в одном файле - animate.css

Использование

Подключаем файл animate.css перед тегом <head>:

Код
<link rel="stylesheet" href="animate.min.css">


Чтобы применить анимацию, нужно добавить класс .animated и класс анимации, например .swing:

Код
<div class="swing animated">анимация swing</div>


jQuery

При подключении библиотеки jQuery, возможности использования animate.css переходят на новый уровень.

Анимация при наведении.

Ищем элементы по селектору .animated, для которых при наведении мы будем добавлять класс анимации - swing.

Код
$('.animated').hover(
function() {
$(this).addClass('swing');
},
function() {
$(this).removeClass('swing');
}
);


Посмотреть демо всех анимаций можно на офф.сайте
Теги к материалу
анимаций, css3, ANIMATE.CSS, Сборка
Поделись материалом с друзьями
Рекомендуем к просмотру
К материалу оставили 0 комментариев