實現原理
Animate.css+wow.js
可以不依賴JQuery,並且在移動端也有不錯的效果
使用方法
在想添加動畫的元素中添加’wow’ (必須)
在想添加動畫的元素中添加’animatecss’ (為動畫的Class,可以在該網站找到合適的動畫http://daneden.github.io/animate.css/ 自己寫也可以)
第一步:引入文件
分別wow.js與Animate.css
第二步:針對需要動畫的內容(boxClass)添加類(wow):
<div class="wow bounceInLeft">
……
</div>
例子2:
第三步:添加js腳本
<script>
if (!(/msie [6|7|8|9]/i.test(navigator.userAgent))){
var wow = new WOW({
boxClass: 'wow',
animateClass: 'animated',
offset: 0,
mobile: true,
live: true
});
wow.init();
};
</script>
參考鏈接:https://www.dowebok.com/131.html