zoukankan      html  css  js  c++  java
  • 如何使用Animate.css插件库

    Animate.css插件库是对css3中keyframes动画的一个封装,里面将2D和3D效果进行封装结合,最终形成这个文件,只需要简单的引用就可以,而且兼容其他浏览器

    第一步:下载

    官网地址:https://animate.style/

    官网是一个英文网站,提供了npm,yarn,和CDN的引入方式

    CDN的引入地址:https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css

    还可以在我的百度网盘中下载

    链接:https://pan.baidu.com/s/1bXUyYZ7c7kwnEQUIPP3aiw  密码:zt4p

    第二步:引入

    CDN引入方式:
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
    本地引入方式:
    <link rel="stylesheet" href="./animation.min.css">

    第三步:调用

    创建标签,添加对应的class类名

    animated 表示动画执行的时间

    rollOut 表示动画的样式

    <div class="animated rollOut">欢迎使用Animation</div>
    所有的动画样式,可以参考 https://www.jq22.com/yanshi819 网站
     

    第四步:执行

    直接在浏览器中执行,就能看到效果类

  • 相关阅读:
    jquery 读取 xml 属性等于某值的 方法
    jquery 定时器
    jquery div 滚动条 最底部
    ajax success 不能返回值解决方案 async:false
    wiki 使用说明
    thinkphp 二维码封装函数
    100本书 慢慢来读
    2013 来了
    jquery 解析 xml
    键盘按键 事件
  • 原文地址:https://www.cnblogs.com/ranyihang/p/13679510.html
Copyright © 2011-2022 走看看