CCS3動畫效果插件——Animae.css和WOW.js製作下拉和刷新活動的頁面,效果非常好,用法如下
基本用法
-
在頁面的
<head>
中引入樣式文件:<head> <link rel="stylesheet" href="animate.min.css"> </head>
-
給你想要添加動畫效果的元素加上
animated
樣式,如果想要動畫循環執行的話,你需要加上infinite
樣式。 -
<h1 class="animated infinite bounce">Example</h1>
當你將 animate.css 與 jQuery 一起使用或者添加你自己的 CSS 規則時, 你可以用 animate.css 做一大堆其他的事,使用 jQuery 動態添加動畫:
$('#yourElement').addClass('animated bounceOutLeft');
你也可以檢測一個動畫是否結束了:
$('#yourElement').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', doSomething);