专题：动画 -- IT技术博客大学习 -- 共学习共进步！

“抓娃娃”并不陌生，存在两种结果:抓到与抓不到。在 Web 动画中，如上图，“抓到”与“抓不到”对应着两个动画，可以使用不同的动画图片资源来实现，似乎毫无异义。细做观察，不难发现：两个动画中“动画初始到抓取”及“抓取结束到动画结束”的区间中存在相同动画(滑动和晃动抓杆)。既然动画相同，那么可以通过引用同一份动画图片资源，不做相同图片的重复加载，从而减少总资源大小。 “两个动画间存在部分相同的动画，相同部分可以引用同一份动画图片资源，来减少图片的总大小。” 肉眼进行辨别哪些动画是一样的？那是不可能的。gka提供一键式制作多个动画的方式，支持多种图片优化方案(含图片去重)。 gka 是一款简单的、高效的帧动画生成工具，图片处理工具。

使用 gka 一键生成帧动画

gka 是一款简单的、高效的帧动画生成工具。通过对图片集进行处理，一键式生成序列帧动画文件，并内置相关优化。

javascript动画剖析

最近将去年写过的easyAnim进行了重构和优化以整合到我的javascript框架中，回过头来发现以前写的代码确实还有很多可以改进的地方，这也证明自己还是有点进步的。趁有点时间，将javascript动画运行的机制和实现的思路整理了一下，算是做个小总结，也希望对有兴趣的人有点帮助。篇幅稍长，看之前请自备瓜子啤酒。当然这里说的javascript动画是指利用javascript来计算DOM元素的CSS属性值来实现的动画，HTML5和CSS3的发展让WEB中的动画有了更多的可能，但这些看起来比较高级的东西还需要浏览器给力点才行。

ReactNative Animated动画详解

最近ReactNative（以下简称RN）在前端的热度越来越高，不少同学开始在业务中尝试使用RN，这里着重介绍一下RN中动画的使用与实现原理。

如何在Angular中使用动画

本文主要简单的说明了ngAnimate在Angular项目中的使用，具体可以做出怎样的效果，还需要亲自实践一番。

CSS3 动画系列

10年5月份写过，那时候CSS3 动画基本上只有webkit内核的浏览器，如今CSS3已经大量的被应用到各种项目中，并且逐渐成为前端开发工程师的必备技能。虽然在项目中也经常用CSS3来优化一些体验，但是总觉的自己掌握的不够，所以最近温故知新，总结一下。欢迎大家拍砖讨论。

消除疑问：CSS动画 VS JavaScript

曾经某个时期，大多数开发者使用 jQuery 给浏览器中的元素添加动画。让这个淡化，让那个扩大，很简单。随着互动的项目越来越复杂，移动设备的大量增加，表现性能变得越来越重要。Flash 被抛弃，有天赋的动画开发者使用 HTML5 去实现过去从未实现的效果。他们需要更好的工具去开发复杂的动画序列并获得最好的性能。jQuery 并不能够做到。浏览器日渐成熟的同时也开始提供了一些解决方案。

css3-animation制作逐帧动画

其实假如不拿浏览器的兼容性来说，用css3做一些高帅富浏览器支持的动画效果其实还是很不错的，这个animation就是一个很不错的css3动画属性，特别是那些单色调的图片来做逐帧动画比我们用gif做的动画占用的内存还要小，不过对于GPU渲染是否是一种负荷目前还没有去测试，假如你知道的话不妨说说哈。

jQuery Color Animations颜色动画插件

jQuery的animate方法对颜色无法做动画效果.

解决jQuery动画在chrome下暴走的问题

最近发现用jQuery实现的动画在chrome下会有暴走的问题。例如下面这个页面，打开后红色方块每隔三秒向右移动20像素。此时开一个新的Tab，把这个页面放在后台Tab上等待30秒，然后切换回该页面，就会看到红方块连续向右移动了200像素。

使用Jscex实现排序算法动画

用动画来观察排序算法是一件很酷的事情，例如有人便为各种排序算法提供了动画效果。只可惜这些效果都是实现准备好的gif图片，并非由代码写成。在大部分平台上编写这样的程序并没有太大困难，只要在绘制出图形之后短暂地阻塞线程就行了。可惜，在JavaScript中我们只能“一蹴而就”，要暂停的话，只能使用setTimeout进行回调了。不过，这也正是Jscex的用武之地，用Jscex编写的代码需要“暂停”，只需要简单地调用sleep异步方法，一切...

jQuery中的动画

jQuery天生就是用来做动画的。无论是消息框淡出淡入，菜单栏的滑动打开，或者滚动动画，甚至游戏，都可以用内建的方法或者更丰富的插件来完成。 CSS样式属性动画我们现在有很多的动画方法，滑动、淡出淡入、还有其他的显示隐藏动画，但是我们对于精确的控制动画以及动画到底怎么发生的还不太了解。我们这就来介绍一个非常强大的jQuery函数，animate，这个方法可以让你对任何的CSS属性做动画的效果。

完美实现GIF动画缩略图

缩略图是个很常用的功能。它的实现并不复杂，但如果原图是GIF动画的话，问题就会变得繁琐一点，下面通过一个取自CS警匪游戏的GIF动画来说明问题：为了让问题更加清晰，我们先还原动画各帧：选择一：用PHP中的Imagick模块： writeImage(\'old_\' . $i++ . \'.gif\'); } ?> 选择二：用ImageMagick提供的convert命令： shell&#...

闲谈CSS3动画

随着CSS3越来越热，CSS3动画也逐渐受到大家的关注。这次有幸修改淘宝网全站页头，小小地应用了下(详见http://www.taobao.com/下拉箭头处的hover效果)。与其说是渐进增强，不如说是满足了技术人小小的虚荣心。以下是自己的一点理解，希望能对大家有所帮助。 … 关于CSS3动画从(http://www.w3.org/Style/CSS/current-work)可以看出，CSS动画涉及的知识点包括 CSS 2D Transformations, CSS 3D Transformations, CSS Transition...

利用php创建打印文字动画效果

利用php创建打印文字动画效果用php+imagick+imagemagick实现的代码如下,在ubuntu下如何安装使用imagick+imagemagick,可以看这篇文章，其他操作系统请google相关文章效果图片如下: