前面我们已经说过了要怎样制作CSS3动画，但是SVG动画一直都没有时间研究过，正好趁现在有一点时间静下心来研究一下。 一般来说，常见前端动画实现方案分为三种，CSS3动画，HTML动画（SVG动画），JS动画或者我们可以称之为Canvas动画 这里主要我们是要讲解的是SVG动画的实现方法。 SVG动 ...
分类：
其他好文 时间：
2017-08-27 10:05:58
阅读次数：
211
animation 动画效果组成 通过类似Flash动画中的关键帧来声明一个动画 在animation属性中调用关键帧声明的动画，从而实现一个更为复杂的动画效果 animation的子属性 animation-name : 主要用来指定一个关键帧动画的名字，这个动画名必须对应一个@keyframes ...
分类：
Web程序 时间：
2017-08-26 19:53:09
阅读次数：
267
首先，老阮在他博客讲的很明白了（http://www.ruanyifeng.com/blog/2014/02/css_transition_and_animation.html），这里我来全面总结一下。 一、transition 注：transition需要明确知道，开始状态和结束状态的具体数值，才 ...
分类：
Web程序 时间：
2017-08-26 19:48:26
阅读次数：
178
1、CSS3动画以及animation事件的定义 animation :name duration timing-function delay iteration-count direction animation-name:动画名称 animation-name：keyframename|none ...
分类：
Web程序 时间：
2017-08-26 18:22:47
阅读次数：
211
【CSS3动画】 首先通过@keyframe创建动画 或 然后通过animation属性来指定动画 【animation-fill-mode】 参考： 1、http://www.w3school.com.cn/css3/css3_animation.asp 2、http://www.w3school ...
分类：
Web程序 时间：
2017-08-25 00:02:58
阅读次数：
198
//@keyframes定义动画 //animation-name属性主要是用来调用 @keyframes 定义好的动画。 //animation-duration主要用来设置CSS3动画播放时间（其使用方法和transition-duration类似），是用来指定元素播放动画所持续的时间长。 // ...
分类：
其他好文 时间：
2017-08-23 17:35:09
阅读次数：
123
1》animation-iteration-count属性定义动画应该播放多少次。 animation-iteration-count:infinite; infinite表示无限循环 2》先执行一遍动画，然后再反向执行一遍动画： animation-direction:alternate 语法：a ...
分类：
Web程序 时间：
2017-08-23 14:58:40
阅读次数：
167
我们在做项目时难免要用图标的图片，而图片用多则会影响打开网页的加载速度，如果能把多个图标集合到一张图片上，再用css的样式显示你所需要的图片，那么加载速度自然就加快了，同时也提高了用户的体验度 过程如下 這样的一张图 实现下面的效果，便以移动的方式来展现 代码如下 b标签中给背景图 css样式 #i ...
分类：
Web程序 时间：
2017-08-19 21:20:01
阅读次数：
243
最近试了下CSS3动画，现在通过一个例子简单讲一讲我用css3画3d视图的思路。 任何时候敲代码前都要想清楚我要干什么，我要敲一个简单的3d旋转画册。 ...
分类：
Web程序 时间：
2017-08-19 18:30:41
阅读次数：
172
简单讲一讲CSS3的动画属性，transition，transform和animation 一、transition 过渡 transition 是一个简写属性，可扩展为 1.transition-property属性，设置过渡效果的属性名称 值可为：none（没有属性有效果）|| all（所有属性 ...
分类：
Web程序 时间：
2017-08-19 18:28:17
阅读次数：
222
