zoukankan      html  css  js  c++  java
  • 动画利器animate.css

    使用过CSS3编写动画的同学一定感叹CSS3的强大,但是也会感到书写的麻烦。每次都要计算动画的各个参数,十分麻烦。有没有一个库能封装一些常用的CSS3动画效果。答案是肯定的,animate.css就是一个很好的CSS库,github地址:https://github.com/daneden/animate.css 。下面我们一起来看一看如何使用它。

    点击上面的链接,就可以看到一个很简约的页面,其实这个页面就是animate.css的API 文档。在页面中间的下拉框中选择一个动画类,再点击旁边的按钮,就可以看到上方的文字上的动画。

    那么,我们在实际的开发中又该如何使用animate.css。比如我有一个div需要使用bounce动画。那么就可以如下面的方法来编写:

    1 <div id="animate-1" class="animated">演示bounce动画</div>

    注意class=“animated” 是调用动画必备的,然后就在需要的时候调用:

    1 $('.animate-1').addClass('bounce');

    这样,就可以看到动画了。我简单试了一下,这些动画在移动平台上也是可以用的。

  • 相关阅读:
    linux安装java环境
    前端JS-websocket与后端通信
    windows安装NodeJS/修改全局路径/配置镜像站
    vue基础---13vue-router
    uni-app项目
    vue基础---12脚手架
    vue基础---11组件
    vue基础---10生命周期
    vue基础---09表单输入绑定
    vue基础---08事件
  • 原文地址:https://www.cnblogs.com/webARM/p/4277085.html
Copyright © 2011-2022 走看看