animated css

先到     http://imakewebthings.com/waypoints/  下載 js

然後把他放在   /js/  folder

然後再到    https://daneden.github.io/animate.css/  下載  css

然後把他放在   /css/  folder


在code 裡面加入使用 ...


css:

<link rel="stylesheet" type="text/css" href="vendors/css/animate.css">

js:

 <script src="vendors/js/jquery.waypoints.min.js"></script>


在  html5 裡面加入相對應的class name


例如:    <span class="js--wp-5">

 <div class="col-md-8 col-sm-8 col-xs-6 tetimonmeta">
                    林惠文
                    <span class="js--wp-5">小文</span>
                </div>


然後在js裡面加入


$(document).ready(function(){


 $('.js--wp-5').waypoint(function(direction){
        $('.js--wp-5').addClass('animated zoomInDown');
    }, {
        offset:'50%'
    });


});


要甚麼效果可以自己去選

例如 :  要  bounceIn 就打 bounceIn ..  大小寫要一模一樣