日常中,我们使用的动画来源有两个方面——

第一个,自己去定义。

  通过@keyframes去定义即可,格式如下:

@keyframe animatename{

    0%{

    //这里面写初始的对象的css样式

  }

    100%{

     //这里写结束时候的css样式

  }

}

  起始与结束之间可以写无数个中间css样式,格式保持一致,然后愉快的书写就可以了。当一个动画书写完毕之后,便可以调用执行了。执行方式是——

#aa{

//其他css

animation-name:"";名字

animation-duration:"";持续时间

基本上有着两个就可以初步执行了

}

  2. 事实上,书写动画是非常麻烦和恶心的事情,不仅类,而且效果做出来还不一定好看,如果里面又写错了什么,那就是灾难。于是,我们可以使用第二种方法——使用animate.css。

这个css是开源的东西,到处都可以下载得到,将它下载下来之后便可以直接使用,快速,便捷,使用方法和上面的一模一样。

动画——animation(2)的更多相关文章

  1. 动画animation的三个应用(漂浮的白云、旋转的星球、正方体合成)

    × 目录 [1]漂浮的白云 [2]旋转的星球 [3]正方体合成 前面的话 前面介绍过动画animation的详细用法,本文主要介绍动画animation的三个效果 漂浮的白云 [效果演示] [简要介绍 ...

  2. CSS3的变形transform、过渡transition、动画animation学习

    学习CSS3动画animation得先了解一些关于变形transform.过渡transition的知识 这些新属性大多在新版浏览器得到了支持,有些需要添加浏览器前缀(-webkit-.-moz-.- ...

  3. 精灵动画Animation对话框组成Idle动画的各精灵

    精灵动画Animation对话框组成Idle动画的各精灵 1.3  精灵动画 场景中已经添加了精灵,现在是时候让让它动起来了.读者也许已经从精灵图集中,各精灵的命名中看出来了,这个精灵一共有两种动画状 ...

  4. Qt-4.6动画Animation快速入门三字决

    Qt-4.6动画Animation快速入门三字决 Qt-4.6新增了Animation Framework(动画框架),让我们能够方便的写一些生动的程序.不必像以前的版本一样,所有的控件都枯燥的呆在伟 ...

  5. css3 动画(animation)-简单入门

    css3之动画(animation) css3中我们可以使用动画,由于取代以前的gif图片,flash动画,以及部分javascript代码(相信有很多同学都用过jquery中的animate方法来做 ...

  6. Android 动画animation 深入分析

    转载请注明出处:http://blog.csdn.net/farmer_cc/article/details/18259117 Android 动画animation 深入分析 前言:本文试图通过分析 ...

  7. View 动画 Animation 运行原理解析

    这次想来梳理一下 View 动画也就是补间动画(ScaleAnimation, AlphaAnimation, TranslationAnimation...)这些动画运行的流程解析.内容并不会去分析 ...

  8. CSS3动画属性:动画(animation)

    一:动画(animation)的参数详解 由于上面用到了animation动画,这里详细介绍下这个animation的参数. 简介 CSS动画(Animations)简单说就是在一段固定的动画时间内暗 ...

  9. 《The Cg Tutorial》阅读笔记——动画 Animation

    这段时间阅读了英文版的NVidia官方的<The Cg Tutorial>,借此来学习基本的图形学知识和着色器编程. 在此做一个阅读笔记. 本文为大便一箩筐的原创内容,转载请注明出处,谢谢 ...

  10. amazeui学习笔记--css(常用组件15)--CSS动画Animation

    amazeui学习笔记--css(常用组件15)--CSS动画Animation 一.总结 1.css3动画封装:CSS3 动画封装,浏览器需支持 CSS3 动画. Class 描述 .am-anim ...

随机推荐

  1. 高性能MySQL第2,3章性能相关 回顾笔记

    1.  基准测试(benchmark)   不管是新手还是专家都要熟悉基准测试,benchmark测试是对系统的一种压力测试,目标是为了掌握在特定压力下系统的行为.也有其他原因:如重现系统状态,或者是 ...

  2. linux命令英文缩写的含义(方便记忆)

    命令缩写: ls:list(列出目录内容) cd:Change Directory(改变目录) su:switch user 切换用户 rpm:redhat package manager 红帽子打包 ...

  3. 关于 HIVE Beeline 问题

    1  启动 hiveserver2 服务,启动 beeline -u jdbc:hive2:// 正常 ,启动 beeline -u jdbc:hive2://127.0.0.1:10000 包如下错 ...

  4. 如何在Eclipse和MyEclipse中安装SVN

    在安装目录下,找到dropins文件夹将svn文件复制进去.

  5. LYF模板连接.txt

    在解决方案里创建了一个新建网站,在其右键下添加一个模板后,准备使用模板的,在添加新建项里突然没有“使用模板页的web窗体”,顿时感觉悲剧... 解决方法:模板页代码---LYFMaterPage.Ma ...

  6. VBS脚本操作网页元素

    =================打开百度,点击百度按钮==================== Dim btn,ieSet ie = WScript.CreateObject("Inter ...

  7. vc里面怎样实现对话框之间传递变量的值

    Dialog1的类名是CDialog1, 头文件是dialog1.h.里有成员变量CString str1, str2;Dialog2的类名是CDialog2, 头文件是dialog2.h.里有成员变 ...

  8. 在线协作沟通工具DesignBoard帮助设计团队更有效地进行沟通与版本管理

    设计稿呈现缺乏整体性.远程沟通效率低.多版本管理混乱,这可能是很多创业团队都面临的问题,并且这些问题都将直接影响到产品开发进度.国内创业团队彩程设计也曾面临同样的问题,后来他们在做某个新项目时尝试把设 ...

  9. Spring Bean 生命周期

    转自:也谈Spring Bean的生命周期 开篇先用一张老图描述下Spring中Bean容器的生命周期. 插叙一下,记得某个博文中提到:“Spring的Bean容器只管理非单例Bean的生命周期,单例 ...

  10. linux安装tomcat, jdk出现的问题

    1)卸载系统自带的jdk版本:     查看自带的jdk:     #rpm -qa|grep gcj     可能看到如下类似的信息:     libgcj-4.1.2-44.el5     jav ...