Animate.css - сборка CSS3 анимаций
Animate.css - сборка классных, кроссбраузерных анимаций для использования в ваших проектах. Все анимации используют возможности CSS3 и находятся в одном файле - animate.css
Использование
Подключаем файл animate.css перед тегом <head>:
<link rel="stylesheet" href="animate.min.css">
Чтобы применить анимацию, нужно добавить класс .animated и класс анимации, например .swing:
<div class="swing animated">анимация swing</div>
JS
При подключении библиотеки jQuery, возможности использования animate.css переходят на новый уровень.
Анимация при наведении.
Ищем элементы по селектору .animated, для которых при наведении мы будем добавлять класс анимации - swing.
$('.animated').hover(
function() {
$(this).addClass('swing');
},
function() {
$(this).removeClass('swing');
}
);
Посмотреть демо всех анимаций можно на офф.сайте