zoukankan      html  css  js  c++  java
  • animation

    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)
    }
    }

  • 相关阅读:
    webstorm & phpstorm破解
    JSON和JSONP
    angular.extend(dst, src)对象拓展
    angular.foreach 循环方法使用指南
    angular 指令@、=、&的用法和区别
    angular directive指令相互独立
    angular directive指令的复用
    对apply和call的理解
    图片上传
    vue 路由缓存
  • 原文地址:https://www.cnblogs.com/jayruan/p/6079737.html
Copyright © 2011-2022 走看看