animation

标签：async   att   off   data-   ack   lib   set   ted   wow   

https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js

http://mynameismatthieu.com/WOW/dist/wow.min.js

http://mynameismatthieu.com/WOW/css/libs/animate.css

http://mynameismatthieu.com/WOW/

<section class="wow slideInLeft" data-wow-duration="2s" data-wow-delay="5s"></section>
<section class="wow slideInRight" data-wow-offset="10"  data-wow-iteration="10"></section>

new WOW().init();

var wow = new WOW({
  boxClass:     ‘wow‘,      // animated element css class (default is wow)
  animateClass: ‘animated‘, // animation css class (default is animated)
  offset:       0,          // distance to the element when triggering the animation (default is 0)
  mobile:       true,       // trigger animations on mobile devices (default is true)
  live:         true,       // act on asynchronously loaded content (default is true)
  callback:     function(box) {
    // the callback is fired every time an animation is started
    // the argument that is passed in is the DOM node being animated
  }
});
wow.init();

.bounce {
animation: bounce 2s 0s;
}
.zoom-out {
animation: zoom-out 2s;
}
.infinite {
animation-iteration-count: infinite;
}
.mode {
animation-fill-mode: forwards;
}
.direction {
animation-direction: alternate;
}

@keyframes zoom-out {
0% {
transform: scale3d(0,0,0);
}
100% {
transform: scale3d(1,1,1)
}
}

animation

标签：async   att   off   data-   ack   lib   set   ted   wow   

原文地址：http://www.cnblogs.com/jayruan/p/6079737.html