本文首发于https://www.1024nav.com/tools/css-animation-library 转载请注明出处

整理了日常前端开发中常用的css动画库，让你的网页动起来，可以在生成中使用，非常酷炫，值得收藏

animxyz

AnimXYZ 可帮助您为网站创建、自定义和合成动画。由 CSS 变量提供支持，允许几乎无限数量的独特动画而无需编写单个关键帧。节省时间并完全控制元素的移动方式。为 Vue、React、SCSS 和 CSS 构建，AnimXYZ 将使您的网站栩栩如生。

官网地址：https://animxyz.com/

Izmir 图片hover动画效果

Izmir 是一个迷你 CSS 库，可让您快速创建漂亮的图像悬停元素。包含大量样式类和自定义属性，伊兹密尔允许您完全控制和几乎无限的可能性。只需将 CSS 库加载到您的项目中，添加元素标记并结合您选择的样式类来自定义构建您完美的图像悬停效果。

GITHUB地址：https://github.com/ciar4n/Izmir

官网地址：https://ciar4n.com/izmir/

Animatopy

集成了animate.css，但是更加简单，更加灵活，更加方便。只需要拷贝所需代码即可

官网地址：https://sarthology.github.io/Animatopy/

3个CSS动画库，比Animated还好用，让你的网站酷炫起来的更多相关文章

  1. Animate.css动画库，简单的使用，以及源码剖析

    animate.css是什么?能做些什么? animate.css是一个css动画库,使用它可以很方便的快捷的实现,我们想要的动画效果,而省去了操作js的麻烦.同时呢,它也是一个开源的库,在GitHu ...

  2. 048——VUE中使用animate.css动画库控制vue.js过渡效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. uni-app引入css动画库

    引入Animate动画库 Animate中文网地址:http://www.animate.net.cn/ Animate下载地址:https://daneden.github.io/animate.c ...

  4. 八个解决你80%需求的CSS动画库

    八个解决你80%需求的CSS动画库 点击打开视频讲解 在学习和工作的过程中,我们总免不了要写各种各样的css动画,给某个部分添加动画效果,如果觉得自己写的动画效果单一乏味,不妨试试这8个CSS动画库, ...

  5. css动画库

    转载自:http://www.cnblogs.com/starof/p/4968769.html 本文作者starof,因知识本身在变化,作者也在不断学习成长,文章内容也不定时更新,为避免误导读者,方 ...

  6. 基于animate.css动画库的全屏滚动小插件，适用于vue.js(移动端、pc)项目

    功能简介 基于animate.css动画库的全屏滚动,适用于vue.js(移动端.pc)项目. 安装 npm install vue-animate-fullpage --save 使用 main.j ...

  7. css3动画和animate.css动画库使用

    CSS3动画 css3动画可以分为两种.transition过渡动画和keyframes关键帧动画 过渡动画 第一种叫过渡(transition)动画,就是从初始状态过渡到结束状态这个过程中所产生的动 ...

  8. （生产）animate.css 动画库

    官网:https://daneden.github.io/animate.css/ Animate.css是一个有趣的,跨浏览器的css3动画库 用法 首先引入animate css文件:    &l ...

  9. CSS动画库——animate.css的使用

    Animate.css是一款强大的CSS3动画库 官网地址:https://daneden.github.io/animate.css/ 使用方法如下所示: (1)下载animate.css 下载地址 ...

随机推荐

  1. 【UE4 C++ 基础知识】<8> Delegate 委托

    概念 定义 UE4中的delegate(委托)常用于解耦不同对象之间的关联:委托的触发者不与监听者有直接关联,两者通过委托对象间接地建立联系. 监听者通过将响应函数绑定到委托上,使得委托触发时立即收到 ...

  2. 【Takin使用日记】记一次TransmittableThreadLocal引起的业务异常

    对于常见的 WEB 容器,Takin 通过增强 org.apache.catalina.core.StandardHostValve#invoke 方法,拦截并解析方法入参的 Request 对象中的 ...

  3. 神经网络 感知机 Perceptron python实现

    import numpy as np import matplotlib.pyplot as plt import math def create_data(w1=3,w2=-7,b=4,seed=1 ...

  4. AtCoder Beginner Contest 210题解

    A B 过水,略... C 统计长度为k的区间的最多本质不同的数.用尺取法维护下左右指针就可以了.调了许久的原因是更新答案时出现了问题. 当我移动指针时,我们应该移动一个就更新一个,而不是将移动与更新 ...

  5. PWN二进制漏洞学习指南

    目录 PWN二进制漏洞学习指南 前言 前置技能 PWN概念 概述 发音 术语 PWN环境搭建 PWN知识学习途径 常见漏洞 安全机制 PWN技巧 PWN相关资源博客 Pwn菜鸡小分队 PWN二进制漏洞 ...

  6. x64 InlineHook 黑魔法

    目录 x64 InlineHook 黑魔法 为什么不能用X86 的HOOK方式? 原理:jmp + rip 进行寻址6字节方式跳转 手动InlineHook 临时地址x(找一块空内存) 计算偏移 源地 ...

  7. Vue面试题01

    说出vue常用的指令: v-text,  v-html,  v-bind,  v-for,  v-if,  v-else,  v-else-if,   v-show,    v-on, 谈谈你对MVC ...

  8. 01_WPF概述

    目录 Windows 图形演化 高级API 分辨率无关性 WPF体系结构 我的微信公众号 Windows 图形演化 在 WPF 之前,windows 开发一直使用本质上相同的显示技术.每个传统 win ...

  9. InnoDB存储引擎的锁

    InnoDB存储引擎的锁 锁的类型 锁的类型包括: 1.     共享锁(S lock),允许事务读取一行数据 2.     排他锁(X lock),允许事务删除或更新一行数据 锁的兼容性a X S ...

  10. redis开外网访问

    Redis: 注释掉bind 127.0.0.1可以使所有的ip访问redis 若是想指定多个ip访问,但并不是全部的ip访问,可以bind protected-mode no /etc/init.d ...