1.从chrome webstore下载

chrome应用商店安装地址

2.直接下载crx文件

如果无法访问到chrome的应用商城,可以选择下载app.crx文件,在chrome中打开chrome://extensions/页面,将app.crx插件拖动到扩展程序面板即可完成安装。
下载地址

3.自行构建

  • npm install -g vue-cli

  • git clone https://github.com/vace/css3-animation-generator

  • cd css3-animation-generator && npm install

  • npm run app

样式导出规则:

  1. 优先使用带有 c3前缀的class,如 <span class="c3-test">animate it</span>

  2. 如果存在class,则使用class选择器,如 <span class="fl animate">animate it</span>

  3. 如果定义了Id,则使用id选择器,如 <span id="anim1">animate it</span>

  4. 如果都不存在,则使用内部自定义的选择器查找方案

例子

css3动画制作工具的更多相关文章

  1. CSS Animatie是一款在线制作CSS3动画的工具,可以在线直接制作CSS3动画效果,生成代码

    CSS Animatie是一款在线制作CSS3动画的工具,可以在线直接制作CSS3动画效果,生成代码 CSS Animatie 彩蛋爆料直击现场 CSS Animatie是一款在线制作CSS3动画的工 ...

  2. CSS3动画制作

    CSS3动画制作 rotate 绕中心旋转 fadeInPendingFadeOutUp 先渐现,停留2s,再向上滑动并逐渐消失 fadeInUp2D 向上滑动并渐现, 因Animate.css的fa ...

  3. 关于HTML5在动画制作工具Animatron的一些问题

    Animatron是国外一款在线HTML5动画制作工具,网址:www.animatron.com 当然,想使用的话,是需要FQ的. 用animatron制作好的动画是可以下载为代码和GIF的,这时候付 ...

  4. MFC实现Gif动画制作工具

    每天来博客园逛,看里面各种好文章,发现自己已经许久没有分享点什么了. 前几天用MFC设计了一个小型的Gif动画制作工具,思路如下: 1.支持图片格式:"*.jpg","* ...

  5. SVG动画制作工具 , 从此抛弃臃肿的gif

    VG简介 只要是程序员的你,你不得不知道svg图片,它可以无限任意放大拉伸都不会损失画质,就像系统字体一样可以无限矢量放大,svg更高级是可以用来制作矢量动画,现在各大浏览器和系统基本对svg已经支持 ...

  6. [置顶] 我的Android进阶之旅------>介绍一款集录制与剪辑为一体的屏幕GIF 动画制作工具 GifCam

    由于上一篇文章:我的Android进阶之旅------>Android之动画之Frame Animation实例 中展示的是Frame动画效果,但是之前我是将图片截取下来,不好说明确切的动画过程 ...

  7. 我的Android进阶之旅------>介绍一款集录制与剪辑为一体的屏幕GIF 动画制作工具 GifCam

    由于上一篇文章:我的Android进阶之旅------>Android之动画之Frame Animation实例 中展示的是Frame动画效果,但是之前我是将图片截取下来,不好说明确切的动画过程 ...

  8. 简单CSS3动画制作

    本贴已重新编辑至http://www.cnblogs.com/fastmover/p/4977358.html 最近需要用到了一些CSS3动画,基本用Animate.css(https://githu ...

  9. CSS3动画制作的简单示例

    CSS3 大大强化了制作动画的能力,但是如果要做出图案比较复杂的动画,选择 GIF 依然是一个不错的选择.今天给大家介绍一个使用 CSS animation 配合雪碧图(CSS sprite)来制作动 ...

随机推荐

  1. python模块之importlib(py3中功能有明显加强)

    # -*- coding: utf-8 -*-#python 27#xiaodeng#python模块之importlib(py3中功能有明显加强)

  2. linux常用命令全拼

    命令缩写: pwd:print work directory 打印当前目录 显示出当前工作目录的绝对路径 ps: process status(进程状态,类似于windows的任务管理器) 常用参数: ...

  3. P2093 零件分组【贪心算法练习题】

    题目链接: http://codevs.cn/problem/4888/ https://www.luogu.org/problem/show?pid=2093 题目描述 某工厂生产一批棍状零件,每个 ...

  4. Delta3D Open Source Engine

    在看<游戏编程精粹6>时看到了这个引擎,彩插7是这个引擎的Editor,我一看就是Qt写的,我太熟悉Qt的界面了,呵呵.Editor非常强悍!有类似3dmax的4个视图 下载这个看下吧,里 ...

  5. 子类化QTreeWidgetItem实现增加Item的属性

    因为有需求是点击QTreeWidgetItem需要获取该Item的节点的相关属性,Item需要保存关联的属性,那么就需要扩展QTreeWidgetItem,当然,C++中扩展修改一个类或组件的方式就是 ...

  6. Kibana 日志查询

    1 概述 很多系统的日志都会放在 Kibana 供查询,就是所谓的 ELK.Kibana 除了可以使用界面供的一些 tab 或者 button 去筛选日志,也可以在搜索栏中使用 Lucene 的语法简 ...

  7. HDUOJ-----Climbing Worm

    Climbing Worm Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Tot ...

  8. hihocoder第196周

    此题解法:动态规划,倒骑毛驴. 在使用动态规划的时候,如果正着求难求,可以考虑倒着来. 这道题坑不少,自己代码能力太弱了,写代码的过程中总是容易犯细节错误.虽然大的方向是对的,但是小坑非常致命! 比如 ...

  9. HTTP代理服务器

    一.什么是代理服务器 代理服务器英文全称是Proxy Server,其功能就是代理网络用户去取得网络信息.形象的说:它是网络信息的中转站. 在一般情况下,我们使用网络浏览器直接去连接其他Interne ...

  10. Linux运维工程师面试-部分题库

    一.Linux操作系统知识 1.常见的Linux发行版本都有什么?你最擅长哪一个?它的官网网站是什么?说明你擅长哪一块?   2.Linux开机启动流程详细步骤是什么?系统安装完,忘记密码如何破解? ...