详细的介绍！CSS3 Transitions, Transforms和Animation使用简介与应用展示

Bertha 。 2021-09-10 12:04 207阅读 0赞

[张鑫旭-鑫空间-鑫生活][-_-]

it's my whole life!

*  [网站首页][-_-][提问交流][Link 1] [前端调查][Link 2]
 *  [前端技术][Link 3][css][] [js/jQuery][js_jQuery] [翻译][Link 4]
 *  [生活与创作][Link 5][生活][Link 6] [散文][Link 7] [小说][Link 8]
 *  **前端在线资源**[CSS3参考][CSS3] [jQuery1.4参考][jQuery1.4]

►

«  [jQuery页面滚动图片等元素动态加载实现][jQuery]

[小tip：iframe高度动态自适应][tip_iframe] »

## CSS3 Transitions, Transforms和Animation使用简介与应用展示 ##

by [zhangxinxu][-_-] from [http://www.zhangxinxu.com][-_-]  
本文地址：[http://www.zhangxinxu.com/wordpress/?p=1268][http_www.zhangxinxu.com_wordpress_p_1268]

### 一、前言兼目录索引 ###

《天龙八部》里的虚竹小和尚之前可以说是和尚的先进人物与代表模范，各类清规戒律谨记与严守。但是，后来呢，花姑娘送到跟前，什么戒律都成了浮云，禁不住诱惑享乐去了。啊，我现在似乎有类似的感觉，本来不打算深究CSS3的一些属性的，但是其效果以及实际应用价值之诱惑实在巨大，还是抵挡不住，折腾下了这篇文章。劳民伤财的工程越少越好，所以，这里干脆把CSS3 动画相关的几个属性凑合到一起了，这样，至少一年半载内不会再写相关的文章了。

CSS3动画相关的几个属性是：transition, transform, animation；我分别理解为过渡，变换，动画。虽意义相近，但具体角色不一。就像是SHE组合，虽然都是三个女生，都唱同一首歌，但有负责高音，和擅长低音的，具体工作于角色还是有差异的。//zxx:貌似那个谁谁烧伤了，真是不幸~~![sad.gif][]

transition指过渡啦，就是从a点都b点，就像过江坐渡轮，是有时间的，是连续的，一般针对常规CSS属性；transform指变换，就那几个固定的属性：旋转啦，缩放啦，偏移啦什么的，与独立于远房亲戚transition使用，但是，效果就是很干涩机械的旋转移动。要是配合transition属性，旋转啊什么的，就会很平滑。animation最先安家于Safari浏览器，自成一家，与transition和transform有老死不相往来之感，但是要说单挑的话，animation要比transition厉害些。

**目录索引**  
[1. 话说Transitions这厮][1. _Transitions]  
[2. 话说Transforms这货][2. _Transforms]  
[3. 话说Animation这物][3. _Animation]  
[4. 更实际综合的效果展示][4.]  
[5. 浏览器支持情况][5.]  
[6. 参考文章及延伸阅读][6.]  
[7. 结语这东西][7.]

### 二、话说Transitions这厮 ###

CSS3 transition属性早在去年我的“[CSS3 transition实现超酷图片墙动画效果][CSS3 transition]”一文中就有过介绍。其作用是：***平滑的改变CSS的值***。无论是点击事件，焦点事件，还是鼠标hover，只要值改变了，就是平滑的，就是动画。于是乎，只要一个整站通用的class，就可以很轻松的渐进增强地实现动画效果，超有实用价值的说。

transition有下面些具体属性：

> transition-property :\* //指定过渡的性质，比如transition-property:backgrond 就是指backgound参与这个过渡  
> transition-duration:\*//指定这个过渡的持续时间  
> transition-delay:\* //延迟过渡时间  
> transition-timing-function:\*//指定过渡类型，有ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier

例如下面这个很简单的例子：

.trans {
        -webkit-transition-property: background-color;
        -webkit-transition-duration: 0.3s;
        -webkit-transition-timing-function: ease;
    }
    .trans:hover {
        background-color: #486AAA;
        color: #fff;
    }

结果在Safari或是Chrome浏览器下可以看到如下效果：  
![背景色过渡效果 张鑫旭-鑫空间-鑫生活][_-_-]

如果你正在使用或有webkit核心的浏览器，您可能狠狠地点击这里：[webkit内核浏览器下背景色过渡demo][webkit_demo]

就跟CSS2的background属性一样，平时我们都不会像上面一样，把transition的属性一个一个摊开写，而是合并。

还是上面的例子，我们将transition属性合并，并扩展几个浏览器，如下CSS代码：

.trans {
        ...
        -webkit-transition: background-color 0.3s ease;
        -moz-transition: background-color 0.3s ease;
        -o-transition: background-color 0.3s ease;
        transition: background-color 0.3s ease;
    }
    .trans:hover {
        background-color: #486AAA;
        color: #fff;
    }

如下HTML代码：

结果如下截图（截自Opera 10.6浏览器）：  
![Opera下背景色过渡 张鑫旭-鑫空间-鑫生活][Opera_ _-_-]

transition中的transition-timing-function属性让人心存芥蒂，其一堆ease相关的值（linear | ease-in | ease-out | ease-in-out | cubic-bezier），不太容易让人理解与记住。尤其其中cubic-bezier就是指[贝塞尔曲线][Link 9]，与复杂的数学扯上的关系，不禁勾起了高中时数学的梦魇。

其实呢，理一理，也还好。首先cubic-bezier这个基本上就不用鸟了，99%的情况都用不到这个东西，所以，难得清闲，直接pass掉。linear很好记，线性嘛。至于ease-in | ease-out | ease-in-out，就是指缓动效果啦，说白了就是指开始时候慢慢动呢还是结束的时候慢慢动。那么in和out那个先慢慢动呢？啊，我们可以联想记忆，很好记的。我们都知道OOXX吧，ease-in中的in就表示进入，进入的时候显然一开始都是慢的，等瞄准就绪后才能快速冲刺进入，于是ease-in表示先慢后快；ease-out其out表示出来，出来肯定是先快后慢的，因为出来时临近洞口速度肯定要降下来，免得跑出来乱了节奏，于是ease-out表示先快后慢；最后，很好理解的，ease-in-out表示一进一出，也就是先慢后快再慢。

有些纯洁的人可能不太明白上面邪恶的文字表示的含义，没关系，我们可以看图说话，下面截自不同运动曲线下同一时间的截图，从中可以看到哪个先快，哪个先慢（注意：最后都是同时到达）：  
![不同过渡值效果 张鑫旭-鑫空间-鑫生活][_-_- 1]

要是你觉得上面的静态的截图表意不够具体，您可以狠狠地点击这里：[不同缓动类效果demo][demo](Opera/Chrome/Safari)

您可以观察方块的运动规律，知道不同缓动名称的效果是如何的。

以上就是transition的简单介绍，要查看更详细更权威的信息，可以去[官方页面查看][Link 10]。

### 三、话说transform这货 ###

transform指变换，使用过photoshop的人应该知道里面的Ctrl+T自由变换。transform就是指的这个东西，拉伸，压缩，旋转，偏移。见下面示例代码：

.trans_skew { transform: skew(35deg); }
    .trans_scale { transform:scale(1, 0.5); }
    .trans_rotate { transform:rotate(45deg); }
    .trans_translate { transform:translate(10px, 20px); }

结果就有类似下面的些效果：  
![transform的些效果 张鑫旭-鑫空间-鑫生活][transform_ _-_-]

您可以狠狠地点击这里：[transform些属性效果demo][transform_demo]

transform属性要是加上transition的过渡特性，那可就是如虎添翼，樱木花道配上流川枫啊，可以产生不少美妙的火花，例如下面这个例子，关键代码如下：

.trans_effect {
        -webkit-transition:all 2s ease-in-out;
        -moz-transition:all 2s ease-in-out;
        -o-transition:all 2s ease-in-out;
        -ms-transition:all 2s ease-in-out;    
        transition:all 2s ease-in-out;
    }
    .trans_effect:hover {
        -webkit-transform:rotate(720deg) scale(2,2);
        -moz-transform:rotate(720deg) scale(2,2);
        -o-transform:rotate(720deg) scale(2,2);
        -ms-transform:rotate(720deg) scale(2,2);
        transform:rotate(720deg) scale(2,2);        
    }

结果在Chrome预计Safari浏览器下就有了祖玛里面青蛙挂掉时的缩放旋转效果了：  
![transform动画默认 张鑫旭-鑫空间-鑫生活][transform_ _-_- 1]  
鼠标经过时：  
![transform动画进行时截图 张鑫旭-鑫空间-鑫生活][transform_ _-_- 2]

如果你手上有webkit核心的浏览器，可以狠狠地点击这里：[酷酷的缩放旋转动画demo][demo 1]

transform还支持3D变换，怎一酷字了得。由于某些不可告人的原因，这里就不展示了。故，transform部分到此结束。

### 四、话说animations这物 ###

截止2010年11月份，animations这物似乎还是只在webkit核心的浏览器上起作用，所以本段落的一些demo效果，需在webkit核心浏览器下查看，不在重复赘述。

animations的介绍以实例驱动。先看简单的缩放扩展动画实例：  
您可以狠狠地点击这里：[animations水平弹性缩放变色动画][animations]

效果大致如下，默认是个很规矩很安静的矩形框：  
![安静的矩形 张鑫旭-鑫空间-鑫生活][_-_- 2]

鼠标移上去后显示慢慢的宽度增加，然后突然快速的宽度增加，同时背景色加深，下为动画过程中的截图：  
![animate动画过程中截图 张鑫旭-鑫空间-鑫生活][animate_ _-_-]

关键的CSS代码如下：

@-webkit-keyframes resize {
        0% {
            padding: 0;
        }
        50% {
            padding: 0 20px;
            background-color:rgba(190, 206, 235, 0.2);        
        }
        100% {
            padding: 0 100px;
            background-color:rgba(190, 206, 235, 0.9);
        }
    }
    .anim_box:hover {
        -webkit-animation-name: resize;
        -webkit-animation-duration: 1.5s;
        -webkit-animation-iteration-count: 4;
        -webkit-animation-direction: alternate;
        -webkit-animation-timing-function: ease-in-out;
    }

此例子中，鼠标悬停时动画只执行4次。

animations不仅适用于CSS2中的属性，CSS3也是支持的，例如box-shadow盒阴影效果，所以，我们可以实现外发光效果的。使用过web qq的人应该有印象，当鼠标移到聊天对象脑袋上的时候会有蓝色外发光的动画，但是那是gif动画图片实现的（现在自动跳转到web qq 2.0已看不到效果）。gif动画实现的效果类似于下面（很兼容）：

[![14.jpeg][]][http_www.zhangxinxu.com_wordpress_p_1268] 摸左边张含韵

但是gif的重用性有限而且制作破费功夫，如果简单几行CSS代码就可以实现高性能高扩展的效果岂不更加，现在animations就可以搞定这一些。

您可以狠狠地点击这里：[animations下的外发光动画demo][animations_demo]

发光效果如下：  
![外发光效果demo 张鑫旭-鑫空间-鑫生活][demo _-_-]

主要的CSS代码如下：

@-webkit-keyframes glow {
        0% {
            -webkit-box-shadow: 0 0 12px rgba(72, 106, 170, 0.5);
            border-color: rgba(160, 179, 214, 0.5);         
        }
        100% {
            -webkit-box-shadow: 0 0 12px rgba(72, 106, 170, 1.0), 0 0 18px rgba(0, 140, 255, 1.0);
            border-color: rgba(160, 179, 214, 1.0); 
        }
    }
    .anim_image {
        padding:3px;
        border:1px solid #beceeb;
        background-color:white;
        -moz-box-shadow: 0 0 8px rgba(72, 106, 170, 0.5);
        -webkit-box-shadow: 0 0 8px rgba(72, 106, 170, 0.5);
        box-shadow: 0 0 8px rgba(72, 106, 170, 0.5);
    }
    .anim_image:hover {
        background-color:#f0f3f9;
        -webkit-animation-name: glow;
        -webkit-animation-duration: 1s;
        -webkit-animation-iteration-count: infinite;
        -webkit-animation-direction: alternate;
        -webkit-animation-timing-function: ease-in-out;    
    }

animation展示结束，的说~~

### 五、更实际综合的效果展示 ###

首先，**鼠标悬停的淡入淡出**效果。

您可以狠狠地点击这里：[鼠标悬停的淡入淡出demo][demo 2]

目前，非webkit核心浏览器下面，鼠标悬停仅仅是透明与不透明，只有在webkit核心浏览器下面才有平滑的动画效果，如下图：  
![淡入淡出过程截图 张鑫旭-鑫空间-鑫生活][_-_- 3]

相关的核心的CSS代码如下：

.anim_image {
        -webkit-transition: all 1s ease-in-out;
        -moz-transition: all 1s ease-in-out;
        -o-transition: all 1s ease-in-out;
        transition: all 1s ease-in-out;
        cursor:pointer;
    }
    .anim_image_top {
        position: absolute;
        -webkit-transform: scale(0, 0);
        opacity: 0;
        filter: Alpha(opacity=0);
    }
    .anim_box:hover .anim_image_top , .anim_box_hover .anim_image_top {
        opacity: 1;
        filter: Alpha(opacity=100);
        -webkit-transform: scale(1, 1);
        -webkit-transform-origin: top right;        
    }
    .anim_box:hover .anim_image_bottom, .anim_box_hover .anim_image_bottom {
        -webkit-transform: scale(0, 0);
        -webkit-transform-origin: bottom left;
    }

HTML代码如下：

当然，这里应用transform的旋转，水平垂直缩放效果也是很赞的，如下图所示：  
![图片旋转切换动画截图 张鑫旭-鑫空间-鑫生活][_-_- 5]

您可以狠狠地点击这里：[图片旋转切换动画demo][demo 5]

CSS代码与上面的例子大同小异，这里就不展示了，您可以去demo页面查看。

下面，展示的是更加实际更加靠谱的例子，**选项卡切换**。  
我们平时的选项卡切换基本上都是很生硬的，直接啪啪啪，切换过来了，没有点过渡啊什么的（毕竟写JavaScript动画成本较高），现在，有了transitions，实现过渡效果就是几行CSS代码的事情，不多说了，直接上实例。

您可以狠狠地点击这里：[平滑选项卡切换demo][demo 6]

在demo中，点击下面的几个图片文字按钮状的东西，就可以看到图片水平滑过来，再滑过去，再滑过来，让人爱不释手啊。下图为截图：  
![选项卡平滑切换demo 张鑫旭-鑫空间-鑫生活][demo _-_- 1]

CSS其作用的就是那个值以all开头的transition属性，如下：

.trans_image_box {
        width: 2000px;
        height: 300px;
        -webkit-transition: all 1s ease-in-out;
        -moz-transition: all 1s ease-in-out;
        -o-transition: all 1s ease-in-out;
        transition: all 1s ease-in-out;
    }

transitionCSS代码组很吃得开的。

只要是CSS值变换的，只要是额外有transition属性设置的，都是平滑效果，都是动画。所以，我们看看如何以动画形式实现经典的手风琴切换效果。

您可以狠狠地点击这里：[手风琴效果demo][demo 7]（点击水平标题有惊喜）

下为截图：  
![手风琴效果截图 张鑫旭-鑫空间-鑫生活][_-_- 6]

其中JavaScript扮演的角色只是变变高度值而已，动画，都是CSS一人挑大梁完成的，很赞吧。下面的代码就是动画效果那段div上的CSS代码：

.acco_content {
        height:0;
        padding:0 10px;
        -webkit-transition: all 1s ease-in-out;
        -moz-transition: all 1s ease-in-out;
        -o-transition: all 1s ease-in-out;
        transition: all 1s ease-in-out;
        overflow:hidden;
    }

JavaScript的作用不过是变变高度而已：

$$(".acco_title").click(function() {
        var rel = this.lang, cl = this.className, oOn = $$(".acco_title_on")[0], rel_on = oOn.lang;
        if (!/on/.test(cl) && rel && rel_on) {
            $$("#" + rel)[0].style.height = "140px";
            $$("#" + rel_on)[0].style.height = "0";
            this.className = "acco_title acco_title_on";
            oOn.className = "acco_title";
        }
    });

### 六、浏览器支持情况 ###

#### CSS Transitions ####

首次引入

*  Safari 3.2: 13/11/2008
 *  Firefox 4.0: Late 2010
 *  Chrome 1.0: 02/09/2008
 *  Opera 10.5: 02/03/2010

#### CSS 2D Transformations ####

首次引入

*  Safari 3.2: 13/11/2008
 *  Firefox 3.5: 30/06/2009
 *  Chrome 1.0: 02/09/2008
 *  Opera 10.5: 02/03/2010
 *  Internet Explore 9: 09/2010

#### CSS Animations ####

首次引入

*  Safari 4.0: 11/06/2008
 *  Chrome 1.0: 02/09/2008

#### CSS 3D Transformations ####

首次引入

*  Safari 4.0: 11/06/2008
 *  Chrome: 28/08/2010

### 七、参考文章以及延伸阅读 ###

*  [Understanding CSS3 Transitions][]
 *  [Using CSS3 Transitions, Transforms and Animation Intro][Using CSS3 Transitions_ Transforms and Animation Intro]
 *  [W3C: CSS Transitions Module Level 3][Link 10]
 *  [W3C: CSS 2D Transforms Module Level 3][W3C_ CSS 2D Transforms Module Level 3]
 *  [W3C: CSS 3D Transforms Module Level 3][W3C_ CSS 3D Transforms Module Level 3]
 *  [W3C: CSS Animations Module Level 3][W3C_ CSS Animations Module Level 3]
 *  [Surfin’ Safari (check the archives)][Surfin_ Safari _check the archives]
 *  [CSS3 Transitions support in Opera Presto 2.3][]

### 八、差点忘掉的结语 ###

虽然目前很多浏览器还没有完全支持transition, transform, animation这些属性，但是在渐进增强的原则下，其高效的动画实现方式还是有很实际的应用价值的。你可以不妨试试，点亮你的页面。内容较多，时间有限，文章难免有表述不准确的地方，欢迎指正。

原创文章，转载请注明来自[张鑫旭-鑫空间-鑫生活][-_-]\[[http://www.zhangxinxu.com][-_-]\]  
本文地址：[http://www.zhangxinxu.com/wordpress/?p=1268][http_www.zhangxinxu.com_wordpress_p_1268]

（本篇完）

**如果您觉得本文的内容对您的学习有所帮助，您可以支付宝(左)或微信(右)：**

![alipay.png][]  ![wxpay.png][]

*  [使用CSS3绘制我们的太阳系][CSS3 1] (0.515)
 *  [翻译 - CSS高峰会议内容精选][- CSS] (0.387)
 *  [CSS3 transition实现超酷图片墙动画效果][CSS3 transition 1] (0.372)
 *  [小tip: CSS3 animation渐进实现点点点等待提示效果][tip_ CSS3 animation] (0.331)
 *  [好吧，CSS3 3D transform变换，不过如此！][CSS3 3D transform] (0.330)
 *  [web上渐进使用jQuery Mobile中animate相关CSS][web_jQuery Mobile_animate_CSS] (0.302)
 *  [URL锚点HTML定位技术机制、应用与问题][URL_HTML] (0.302)
 *  [CSS3 box-shadow兼容loading效果兼IE10+ CSS Hack介绍][CSS3 box-shadow_loading_IE10_ CSS Hack] (0.293)
 *  [超级强大的SVG SMIL animation动画详解][SVG SMIL animation] (0.274)
 *  [CSS3无前缀脚本prefixfree.js及Animatable介绍][CSS3_prefixfree.js_Animatable] (0.274)
 *  [一些SVG向下兼容优雅降级技术][SVG] (RANDOM - 0.142)

分享到：        [6][]

标签： [animate][], [animation][], [css3][], [opera][], [transform][], [transition][], [webkit][], [兼容性][Link 11], [渐进增强][Link 12]

这篇文章发布于 2010年11月25日，星期四，23:24，归类于 [css相关][css 1]。 阅读 80197 次, 今日 141 次

### 发表评论（目前35 条评论） ###

名称 (必须)

邮件地址(不会被公开) (必须)

网站

1.  ![e5efd7f67956c0f5989ebb0ac6c203ab_s_32][] 东东 说道：
    
    [2014年12月21日 11:25][2014_12_21_ 11_25]
    
    楼主，还有一种情况没有列出，现有的只能上下左右运动，元素按照弧形运动怎么实现？能帮忙解答下嘛
    
    [回复][Link 13]
2.  ![01cd732039932d49859ae1ee07389ee3_s_32][] Peter 说道：
    
    [2014年11月10日 15:36][2014_11_10_ 15_36]
    
    你真的太屌了
    
    [回复][Link 14]
3.  ![ab844c770876ff04c8b5d81b76eb38bb_s_32][] poke 说道：
    
    [2014年10月23日 11:24][2014_10_23_ 11_24]
    
    你会这么多技巧 你女友知道吗
    
    [回复][Link 15]
4.  ![d8f4b538b189ad021fd2394e6745eb7d_s_32][] [GuanPu][] 说道：
    
    [2014年08月15日 16:37][2014_08_15_ 16_37]
    
    节操呢？
    
    [回复][Link 16]
5.  ![55556b3d7699f431812109402fc0b81c_s_32][] zhishaofei3 说道：
    
    [2014年05月7日 15:58][2014_05_7_ 15_58]
    
    旋转的时候 如果图片很长（宽高不成比例） 那会造成空了一截 有好的方法解决吗？
    
    [回复][Link 17]
    
     *  ![5a81dbe5e0cd39f0ab26f2a20889363d_s_32][] sherleysong 说道：
        
        [2014年08月6日 14:38][2014_08_6_ 14_38]
        
        可以通过外层元素来控制吧？
        
        [回复][Link 18]
        
         *  ![b0bf3270aefd242fc1a72dc2b8f4e21b_s_32][] living 说道：
            
            [2015年02月12日 21:57][2015_02_12_ 21_57]
            
            非常好的CSS案例。楼主还弄个个人主页，牛逼啊。
            
            [回复][Link 19]
6.  ![e3df55080599d8b48e3ad1db85b13ba2_s_32][] [moo][] 说道：
    
    [2013年12月17日 16:13][2013_12_17_ 16_13]
    
    CSS Animations 目前是否还无法监听 执行进度？？？
    
    [回复][Link 20]
7.  ![00e55b6859de8ac2f169666f6b8819ad_s_32][] Bruce 说道：
    
    [2013年09月13日 17:49][2013_09_13_ 17_49]
    
    精品啊！鑫旭兄！文章深入浅出，读起来欲罢不能。
    
    你为HTML5在我国的发展做出了不可磨灭的贡献啊。
    
    撒花~
    
    [回复][Link 21]
8.  ![6c1e20b11d4be141b3e93d8279a26dc0_s_32][] wangOne 说道：
    
    [2013年08月21日 07:09][2013_08_21_ 07_09]
    
    请问下那个手风琴效果的javascript代码为什么我无法运行呢 在W3C的在线编辑页面显示的是Error，用的是google chrome。 谢谢
    
    [回复][Link 22]
9.  ![edc150b639e483b750f03a49e3e04cfa_s_32][] [靖鸣君][Link 23] 说道：
    
    [2013年05月29日 14:20][2013_05_29_ 14_20]
    
    再次拜读~ 真心不错。
    
    [回复][Link 24]
10. ![f350ff40e0f6e70d70d9a863e33b5c04_s_32][] andy 说道：
    
    [2013年01月7日 10:20][2013_01_7_ 10_20]
    
    “animation最先安家于Safari浏览器，自成一家，与transition和transform有老死不相往来之感，但是要说单挑的话，animation要比transition厉害些。”
    
    应该是与transition和animation有老死不相往来之感吧
    
    [回复][Link 25]
11. ![a98bae61443716f9b45a32066275a0b8_s_32][] kevin 说道：
    
    [2012年08月20日 14:45][2012_08_20_ 14_45]
    
    真的很强大，学习了~
    
    [回复][Link 26]
12. ![41e10e9f60d5af06c7456102931c4321_s_32][] [citier][] 说道：
    
    [2012年07月2日 13:27][2012_07_2_ 13_27]
    
    和楼上一样，in out的原理顿时觉悟了，很形象，理解了
    
    [回复][Link 27]
13. ![6a4a887b688cc1e52d903ed3a8de734b_s_32][] 殇\_杀神 说道：
    
    [2012年06月12日 11:59][2012_06_12_ 11_59]
    
    很黄很暴力，不过很容易理解。辛苦了！
    
    [回复][Link 28]
14. ![3450dae7a9a6c3bfb1f4f4ccfa00e815_s_32][] 听风 说道：
    
    [2012年06月4日 02:29][2012_06_4_ 02_29]
    
    好文章啊，高手。。。  
    最近我才开始接触前端，也想自己弄个网站，学习了！！
    
    [回复][Link 29]
15. ![097bb32cddce1c455beb98bd708620ce_s_32][] [哀音][Link 30] 说道：
    
    [2012年05月10日 09:50][2012_05_10_ 09_50]
    
    Chrome Ui代码里看到  
    overlay.addEventListener(‘webkitAnimationEnd’, function(e) \{  
    e.target.classList.remove(‘pulse’);  
    \});
    
    HTML5
    
    [回复][Link 31]
16. ![214a86b0fa69d2d083cb5c978b354806_s_32][] [寒风网][Link 32] 说道：
    
    [2012年03月30日 20:18][2012_03_30_ 20_18]
    
    animations下的外发光动画demo这个，  
    firefox不支持  
    另外，如果是发光的里面有select下拉框，选择的时候会闪个不停（chrome）
    
    [回复][Link 33]
17. ![65e5148788772c0673f83ea46483ac16_s_32][] ioripalm 说道：
    
    [2012年03月20日 01:28][2012_03_20_ 01_28]
    
    可悲的IE9 浏览站主的站很困难!还是safari好!
    
    [回复][Link 34]
18. ![5d8e65a7f0faf22de3cb651a2f4654db_s_32][] J。C 说道：
    
    [2011年08月2日 00:08][2011_08_2_ 00_08]
    
    全部是HOVER触发，如何用JS触发？
    
    [回复][Link 35]
    
     *  ![3e58242902fa8f33162f3f10df892c68_s_32][] [张 鑫旭][-_-] 说道：
        
        [2011年08月2日 19:54][2011_08_2_ 19_54]
        
        @J。C 直接JS改变相关CSS属性值即可，例如image.width = 300;
        
        [回复][Link 36]
19. ![6cff6e4eda891efefd445106e5d33bdb_s_32][] 白天不睡觉 说道：
    
    [2011年06月30日 10:36][2011_06_30_ 10_36]
    
    感谢博主的劳动成果
    
    [回复][Link 37]
20. ![87841b76e695836d9d87ad16d8aaa4f9_s_32][] [小李][Link 38] 说道：
    
    [2011年06月3日 16:32][2011_06_3_ 16_32]
    
    佩服
    
    [回复][Link 39]
21. ![6e00f8d447ef6c4bc9fc21a53b5a2745_s_32][] azoe 说道：
    
    [2011年03月12日 09:01][2011_03_12_ 09_01]
    
    不得不说：了不起！
    
    [回复][Link 40]
22. ![94a17497898cdc76db7ac1f47fb2785e_s_32][] gsid 说道：
    
    [2011年02月28日 15:53][2011_02_28_ 15_53]
    
    mo字及本文很给力
    
    [回复][Link 41]
23. ![994a1f9def6f0901441bba8724adf4d5_s_32][] [龙子][Link 42] 说道：
    
    [2010年12月30日 13:26][2010_12_30_ 13_26]
    
    不错的文章，还有例子举的也很形象，很生动。
    
    [回复][Link 43]
24. ![37a2282eae010b010a950f587185295e_s_32][] [天堂左我往右][Link 44] 说道：
    
    [2010年12月24日 15:00][2010_12_24_ 15_00]
    
    in 和 out太形象了，不仅学到了Transformations。  
    还学到了XXOO的技巧，感谢~~~
    
    [回复][Link 45]
25. ![b1ac2e9e7c7d259d553ea72b193eb7ba_s_32][] chemdemo 说道：
    
    [2010年12月20日 20:15][2010_12_20_ 20_15]
    
    很黄很暴力，很好很给力~
    
    [回复][Link 46]
26. ![c417fee2ade4b366168fc5f37ea54155_s_32][] [wenbin][] 说道：
    
    [2010年12月15日 21:39][2010_12_15_ 21_39]
    
    文章写的太好了。确实ease那边很黄很暴力。不过很形象
    
    [回复][Link 47]
27. ![3791e9a0099a0bfb98f2e6b01dbbbfe2_s_32][] [bluemanta][] 说道：
    
    [2010年11月30日 10:36][2010_11_30_ 10_36]
    
    确实很黄很暴力。。不过瞬间理解了。。
    
    [回复][Link 48]
28. ![4a3279b079e9ca6faac68073ffc8d34c_s_32][] [lujun][] 说道：
    
    [2010年11月29日 13:48][2010_11_29_ 13_48]
    
    博主的博客确实很用心。佩服。
    
    [回复][Link 49]
29. ![c79aacaab32084c8ade02ceb738ed783_s_32][] [iifksp][] 说道：
    
    [2010年11月28日 01:31][2010_11_28_ 01_31]
    
    好全好完整，太赞了。
    
    [回复][Link 50]
30. ![dac67663e506cbdeb7bac75fffb91c4e_s_32][] [freetao][] 说道：
    
    [2010年11月27日 20:06][2010_11_27_ 20_06]
    
    哇，演示效果相当牛逼，ease相关值的介绍文字更是很黄很暴力。。。
    
    [回复][Link 51]
31. ![acfa95d66217654ed1a26c8afca62b58_s_32][] [小宝][Link 52] 说道：
    
    [2010年11月26日 10:42][2010_11_26_ 10_42]
    
    一直在潜水，感觉在不冒个泡有点对不住博主的辛勤劳动的成果啦，赞一个！
    
    [回复][Link 53]
32. ![2c1ed28062367029977b7b12d88ae753_s_32][] [Jankerli][] 说道：
    
    [2010年11月26日 09:27][2010_11_26_ 09_27]
    
    学习了，没想到CSS3还能这样，如果能普及了那以后的工作可真是轻松了哈···
    
    [回复][Link 54]

![zxx_90_0824.jpg][]

张鑫旭[more][]，09年[华中科技大学][Link 55]毕业，目前上海，现就职[ISUX][][上海设计中心][Link 56]，热爱web前端，喜爱钓鱼。

邮箱：zhangxinxu@zhangxinxu.com

微博：[新浪][Link 57] [腾讯][Link 58]([工作机会][Link 56])

*  ## 文章分类 ##
    
     *  [css相关][css 1] (203)
     *  [graphic相关][graphic] (61)
        
         *  [as3菜单][as3] (32)
         *  [canvas相关][canvas] (7)
         *  [SVG相关][SVG 1] (20)
     *  [js相关][js] (107)
        
         *  [jquery相关][jquery] (43)
         *  [js实例][js 1] (49)
     *  [mobile相关][mobile] (11)
     *  [ps相关][ps] (13)
     *  [web综合][web] (30)
     *  [外文翻译][Link 59] (36)
 *  ## 文章存档 ##
    
     *  [2015年三月][2015] (6)
     *  [2015年二月][2015 1] (4)
     *  [2015年一月][2015 2] (4)
     *  [2014年十二月][2014] (7)
     *  [2014年十一月][2014 1] (1)
     *  [2014年十月][2014 2] (3)
     *  [2014年九月][2014 3] (1)
     *  [2014年八月][2014 4] (4)
     *  [2014年七月][2014 5] (3)
     *  [2014年六月][2014 6] (4)
     *  [2014年五月][2014 7] (1)
     *  [2014年四月][2014 8] (5)
     *  [2014年三月][2014 9] (3)
     *  [2014年二月][2014 10] (3)
     *  [2014年一月][2014 11] (3)
     *  [2013年十二月][2013] (3)
     *  [2013年十一月][2013 1] (6)
     *  [2013年十月][2013 2] (1)
     *  [2013年九月][2013 3] (6)
     *  [2013年八月][2013 4] (3)
     *  [2013年七月][2013 5] (7)
     *  [2013年六月][2013 6] (3)
     *  [2013年五月][2013 7] (7)
     *  [2013年四月][2013 8] (5)
     *  [2013年三月][2013 9] (5)
     *  [2013年二月][2013 10] (4)
     *  [2013年一月][2013 11] (10)
     *  [2012年十二月][2012] (5)
     *  [2012年十一月][2012 1] (4)
     *  [2012年十月][2012 2] (4)
     *  [2012年九月][2012 3] (5)
     *  [2012年八月][2012 4] (5)
     *  [2012年七月][2012 5] (5)
     *  [2012年六月][2012 6] (5)
     *  [2012年五月][2012 7] (6)
     *  [2012年四月][2012 8] (4)
     *  [2012年三月][2012 9] (9)
     *  [2012年二月][2012 10] (6)
     *  [2012年一月][2012 11] (4)
     *  [2011年十二月][2011] (5)
     *  [2011年十一月][2011 1] (7)
     *  [2011年十月][2011 2] (3)
     *  [2011年九月][2011 3] (9)
     *  [2011年八月][2011 4] (5)
     *  [2011年七月][2011 5] (6)
     *  [2011年六月][2011 6] (7)
     *  [2011年五月][2011 7] (8)
     *  [2011年四月][2011 8] (8)
     *  [2011年三月][2011 9] (6)
     *  [2011年二月][2011 10] (6)
     *  [2011年一月][2011 11] (5)
     *  [2010年十二月][2010] (7)
     *  [2010年十一月][2010 1] (8)
     *  [2010年十月][2010 2] (7)
     *  [2010年九月][2010 3] (10)
     *  [2010年八月][2010 4] (10)
     *  [2010年七月][2010 5] (10)
     *  [2010年六月][2010 6] (8)
     *  [2010年五月][2010 7] (11)
     *  [2010年四月][2010 8] (14)
     *  [2010年三月][2010 9] (11)
     *  [2010年二月][2010 10] (1)
     *  [2010年一月][2010 11] (16)
     *  [2009年十二月][2009] (14)
     *  [2009年十一月][2009 1] (7)
     *  [2009年十月][2009 2] (6)
     *  [2009年九月][2009 3] (36)
     *  [2009年八月][2009 4] (12)
 *  ## 最新文章 ##
    
     *  [小tip: 纯CSS实现视差滚动效果][tip_ _CSS]
     *  [<position>值简介,相对底部右侧定位,理解百分比定位][position]
     *  [小tips: CSS3 webkit下彩条文字效果实现][tips_ CSS3 webkit]
     *  [半深入理解CSS3 object-position/object-fit属性][CSS3 object-position_object-fit]
     *  [小tip: 使用meta实现页面的定时刷新或跳转][tip_ _meta]
     *  [border-collapse与table td边框opacity透明度诡异解析][border-collapse_table td_opacity]
     *  [CSS中height:100%和height:inherit的异同][CSS_height_100_height_inherit]
     *  [小tip: IE下zoom或Matrix矩阵滤镜中心点变换实现][tip_ IE_zoom_Matrix]
     *  [CSS深入理解流体特性和BFC特性下多栏自适应布局][CSS_BFC]
     *  [图片动态局部毛玻璃模糊效果的实现][Link 60]
 *  ## 热门总排行 ##
    
     *  [jQuery powerFloat万能浮动层下拉层插件][jQuery powerFloat] (254840)
     *  [jQuery Pagination Ajax分页插件中文详解][jQuery Pagination Ajax] (143142)
     *  [基于HTML5的可预览多图片Ajax上传][HTML5_Ajax] (119928)
     *  [好吧，CSS3 3D transform变换，不过如此！][CSS3 3D transform](119166)
     *  [IE6下png背景不透明问题的综合拓展][IE6_png] (116151)
     *  [拜拜了,浮动布局-基于display:inline-block的列表布局][-_display_inline-block](113672)
     *  [让IE6/IE7/IE8浏览器支持CSS3属性][IE6_IE7_IE8_CSS3] (106676)
     *  [jQuery页面滚动图片等元素动态加载实现][jQuery] (103286)
     *  [jQuery-很酷的弹出层效果js插件][jQuery-_js] (103015)
     *  [Ajax Upload多文件上传插件翻译及中文演示][Ajax Upload] (100751)
 *  ## 今日热门 ##
    
     *  [mobilebone.js-mobile移动web APP单页切换骨架][mobilebone.js-mobile_web APP](219)
     *  [小tip: 纯CSS实现视差滚动效果][tip_ _CSS] (192)
     *  [理解CSS3 transform中的Matrix(矩阵)][CSS3 transform_Matrix] (188)
     *  [好吧，CSS3 3D transform变换，不过如此！][CSS3 3D transform] (178)
     *  [让所有浏览器支持HTML5 video视频标签][HTML5 video] (169)
     *  [ieBetter.js-让IE6-IE8拥有IE9+,Chrome等浏览器特性][ieBetter.js-_IE6-IE8_IE9_Chrome](164)
     *  [jQuery页面滚动图片等元素动态加载实现][jQuery] (156)
     *  [CSS3 Transitions, Transforms和Animation使用简介与应用展示][CSS3 Transitions_ Transforms_Animation] (141)
     *  [支付宝捐赠历史-感谢大家的支持与鼓励][-] (132)
     *  [基于HTML5的可预览多图片Ajax上传][HTML5_Ajax] (130)
 *  ## 评论最多文章 ##
    
     *  [jQuery powerFloat万能浮动层下拉层插件][jQuery powerFloat] (236)
     *  [mobilebone.js-mobile移动web APP单页切换骨架][mobilebone.js-mobile_web APP](157)
     *  [基于HTML5的可预览多图片Ajax上传][HTML5_Ajax] (143)
     *  [好吧，CSS3 3D transform变换，不过如此！][CSS3 3D transform] (116)
     *  [新版无图片版zxxbox jQuery弹出框插件][zxxbox jQuery] (96)
     *  [jQuery页面滚动图片等元素动态加载实现][jQuery] (91)
     *  [我是如何对网站CSS进行架构的][CSS] (84)
     *  [精简高效的CSS命名准则/方法][CSS 1] (78)
     *  [关于文字内容溢出用点点点(…)省略号表示][Link 61] (76)
     *  [jQuery powerSwitch万能slide(切换)插件][jQuery powerSwitch_slide] (74)

![zxx_ico.png][] 我的应用 [文章(RSS)][RSS] [返回顶部↑][6] [登录][Link 62]

[-_-]: http://www.zhangxinxu.com/
[Link 1]: http://www.zhangxinxu.com/php/question.php
[Link 2]: http://www.zhangxinxu.com/php/vote.php?id=1
[Link 3]: http://www.zhangxinxu.com/wordpress/
[css]: http://www.zhangxinxu.com/wordpress/?cat=3
[js_jQuery]: http://www.zhangxinxu.com/wordpress/?cat=5
[Link 4]: http://www.zhangxinxu.com/wordpress/?cat=198
[Link 5]: http://www.zhangxinxu.com/life/
[Link 6]: http://www.zhangxinxu.com/life/?cat=3
[Link 7]: http://www.zhangxinxu.com/life/?cat=5
[Link 8]: http://www.zhangxinxu.com/life/?cat=4
[CSS3]: http://www.zhangxinxu.com/css3/
[jQuery1.4]: http://www.zhangxinxu.com/jq/api14/
[jQuery]: http://www.zhangxinxu.com/wordpress/2010/11/jquery%e9%a1%b5%e9%9d%a2%e5%9b%be%e7%89%87%e7%ad%89%e5%85%83%e7%b4%a0%e6%bb%9a%e5%8a%a8%e5%8a%a8%e6%80%81%e5%8a%a0%e8%bd%bd%e5%ae%9e%e7%8e%b0/
[tip_iframe]: http://www.zhangxinxu.com/wordpress/2010/12/%e5%b0%8ftip%ef%bc%9aiframe%e9%ab%98%e5%ba%a6%e5%8a%a8%e6%80%81%e8%87%aa%e9%80%82%e5%ba%94/
[http_www.zhangxinxu.com_wordpress_p_1268]: http://www.zhangxinxu.com/wordpress/?p=1268
[sad.gif]: /images/20210813/fcc6616b3b9b4ce28e11a06f57cc0cf8.png
[1. _Transitions]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/#two
[2. _Transforms]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/#three
[3. _Animation]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/#four
[4.]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/#five
[5.]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/#six
[6.]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/#seven
[7.]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/#eight
[CSS3 transition]: http://www.zhangxinxu.com/wordpress/?p=498
[_-_-]: /images/20210813/1b4492ded8fb404497096f1e7604e8a8.png
[webkit_demo]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-1.html
[Opera_ _-_-]: /images/20210813/e54e3e41c7f54671a88aede55be0f7f9.png
[Link 9]: http://baike.baidu.com/view/60154.htm
[_-_- 1]: /images/20210813/326804a8a798401ab909ca2b124bebc6.png
[demo]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-3.html
[Link 10]: http://www.w3.org/TR/css3-transitions/
[transform_ _-_-]: /images/20210813/078df08797e04e1ba452940781bac31c.png
[transform_demo]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-4.html
[transform_ _-_- 1]: /images/20210813/c6b99b6a221a48a99f7ce7ca6870e4b8.png
[transform_ _-_- 2]: /images/20210813/4438db9836b24fccb67f707a3c72819f.png
[demo 1]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-5.html
[animations]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-6.html
[_-_- 2]: /images/20210813/ab64871c589f42fe9302418149edbb43.png
[animate_ _-_-]: /images/20210813/fdf451882e1f49978c8100f7555cb202.png
[14.jpeg]: /images/20210813/a9072d32483e4f7c9924bdbd91903287.png
[animations_demo]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-7.html
[demo _-_-]: /images/20210813/579e7ce3a6b242ddaa64d52e589c4a49.png
[demo 2]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-8.html
[_-_- 3]: /images/20210813/35a1998df6f643ff9bf9a20c3c1635cf.png
[demo 3]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-9.html
[fade_demo]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-10.html
[demo 4]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-11.html
[_-_- 4]: /images/20210813/ac98f7eaffda4674b986bb7b83effe99.png
[_-_- 5]: /images/20210813/fc71767d377a4efaba0ca21fa15cafd9.png
[demo 5]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-12.html
[demo 6]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-13.html
[demo _-_- 1]: /images/20210813/75b71366ae01490d944ebc0f6500ed75.png
[demo 7]: http://www.zhangxinxu.com/study/201011/css3-transition-animate-demo-14.html
[_-_- 6]: /images/20210813/e71d564a85a447299608bcb033261c1e.png
[Understanding CSS3 Transitions]: http://www.alistapart.com/articles/understanding-css3-transitions/
[Using CSS3 Transitions_ Transforms and Animation Intro]: http://css3.bradshawenterprises.com/
[W3C_ CSS 2D Transforms Module Level 3]: http://www.w3.org/TR/css3-2d-transforms/
[W3C_ CSS 3D Transforms Module Level 3]: http://www.w3.org/TR/css3-3d-transforms/
[W3C_ CSS Animations Module Level 3]: http://www.w3.org/TR/css3-animations/
[Surfin_ Safari _check the archives]: http://webkit.org/blog/
[CSS3 Transitions support in Opera Presto 2.3]: http://www.opera.com/docs/specs/presto23/css/transitions/
[alipay.png]: http://www.zhangxinxu.com/alipay.png
[wxpay.png]: /images/20210813/df983ab3754041b3b2015eb79fbfddf7.png
[CSS3 1]: http://www.zhangxinxu.com/wordpress/2010/05/%e4%bd%bf%e7%94%a8css3%e7%bb%98%e5%88%b6%e6%88%91%e4%bb%ac%e7%9a%84%e5%a4%aa%e9%98%b3%e7%b3%bb/
[- CSS]: http://www.zhangxinxu.com/wordpress/2010/09/%e7%bf%bb%e8%af%91-css%e9%ab%98%e5%b3%b0%e4%bc%9a%e8%ae%ae%e5%86%85%e5%ae%b9%e7%b2%be%e9%80%89/
[CSS3 transition 1]: http://www.zhangxinxu.com/wordpress/2009/12/css3-transformtransition%e5%ae%9e%e7%8e%b0%e8%b6%85%e9%85%b7%e5%9b%be%e7%89%87%e5%a2%99%e5%8a%a8%e7%94%bb%e6%95%88%e6%9e%9c/
[tip_ CSS3 animation]: http://www.zhangxinxu.com/wordpress/2013/06/css3-animation-%e7%82%b9%e7%82%b9%e7%82%b9%e7%ad%89%e5%be%85%e6%8f%90%e7%a4%ba%e6%95%88%e6%9e%9c/
[CSS3 3D transform]: http://www.zhangxinxu.com/wordpress/2012/09/css3-3d-transform-perspective-animate-transition/
[web_jQuery Mobile_animate_CSS]: http://www.zhangxinxu.com/wordpress/2012/11/web-jquery-mobile-css3-animate/
[URL_HTML]: http://www.zhangxinxu.com/wordpress/2013/08/url-anchor-html-%e9%94%9a%e7%82%b9%e5%ae%9a%e4%bd%8d%e6%9c%ba%e5%88%b6-%e5%ba%94%e7%94%a8-%e9%97%ae%e9%a2%98/
[CSS3 box-shadow_loading_IE10_ CSS Hack]: http://www.zhangxinxu.com/wordpress/2013/05/css3-box-shadow-animation-loading-ie10-css-hack/
[SVG SMIL animation]: http://www.zhangxinxu.com/wordpress/2014/08/so-powerful-svg-smil-animation/
[CSS3_prefixfree.js_Animatable]: http://www.zhangxinxu.com/wordpress/2011/11/css3-prefixfree-js-animatable/
[SVG]: http://www.zhangxinxu.com/wordpress/2013/09/svg-fallbacks/
[6]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/#
[animate]: http://www.zhangxinxu.com/wordpress/tag/animate/
[animation]: http://www.zhangxinxu.com/wordpress/tag/animation/
[css3]: http://www.zhangxinxu.com/wordpress/tag/css3/
[opera]: http://www.zhangxinxu.com/wordpress/tag/opera/
[transform]: http://www.zhangxinxu.com/wordpress/tag/transform/
[transition]: http://www.zhangxinxu.com/wordpress/tag/transition/
[webkit]: http://www.zhangxinxu.com/wordpress/tag/webkit/
[Link 11]: http://www.zhangxinxu.com/wordpress/tag/%e5%85%bc%e5%ae%b9%e6%80%a7/
[Link 12]: http://www.zhangxinxu.com/wordpress/tag/%e6%b8%90%e8%bf%9b%e5%a2%9e%e5%bc%ba/
[css 1]: http://www.zhangxinxu.com/wordpress/category/css/
[e5efd7f67956c0f5989ebb0ac6c203ab_s_32]: https://secure.gravatar.com/avatar/e5efd7f67956c0f5989ebb0ac6c203ab?s=32
[2014_12_21_ 11_25]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-196502
[Link 13]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=196502#respond
[01cd732039932d49859ae1ee07389ee3_s_32]: https://secure.gravatar.com/avatar/01cd732039932d49859ae1ee07389ee3?s=32
[2014_11_10_ 15_36]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-158339
[Link 14]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=158339#respond
[ab844c770876ff04c8b5d81b76eb38bb_s_32]: https://secure.gravatar.com/avatar/ab844c770876ff04c8b5d81b76eb38bb?s=32
[2014_10_23_ 11_24]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-145954
[Link 15]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=145954#respond
[d8f4b538b189ad021fd2394e6745eb7d_s_32]: https://secure.gravatar.com/avatar/d8f4b538b189ad021fd2394e6745eb7d?s=32
[GuanPu]: http://www.kuanlee.cn/
[2014_08_15_ 16_37]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-115688
[Link 16]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=115688#respond
[55556b3d7699f431812109402fc0b81c_s_32]: https://secure.gravatar.com/avatar/55556b3d7699f431812109402fc0b81c?s=32
[2014_05_7_ 15_58]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-72534
[Link 17]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=72534#respond
[5a81dbe5e0cd39f0ab26f2a20889363d_s_32]: https://secure.gravatar.com/avatar/5a81dbe5e0cd39f0ab26f2a20889363d?s=32
[2014_08_6_ 14_38]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-110627
[Link 18]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=110627#respond
[b0bf3270aefd242fc1a72dc2b8f4e21b_s_32]: https://secure.gravatar.com/avatar/b0bf3270aefd242fc1a72dc2b8f4e21b?s=32
[2015_02_12_ 21_57]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-233859
[Link 19]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=233859#respond
[e3df55080599d8b48e3ad1db85b13ba2_s_32]: https://secure.gravatar.com/avatar/e3df55080599d8b48e3ad1db85b13ba2?s=32
[moo]: http://aiyoowei.com/
[2013_12_17_ 16_13]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-52408
[Link 20]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=52408#respond
[00e55b6859de8ac2f169666f6b8819ad_s_32]: https://secure.gravatar.com/avatar/00e55b6859de8ac2f169666f6b8819ad?s=32
[2013_09_13_ 17_49]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-40258
[Link 21]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=40258#respond
[6c1e20b11d4be141b3e93d8279a26dc0_s_32]: https://secure.gravatar.com/avatar/6c1e20b11d4be141b3e93d8279a26dc0?s=32
[2013_08_21_ 07_09]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-38865
[Link 22]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=38865#respond
[edc150b639e483b750f03a49e3e04cfa_s_32]: https://secure.gravatar.com/avatar/edc150b639e483b750f03a49e3e04cfa?s=32
[Link 23]: http://weibo.com/hustskyking
[2013_05_29_ 14_20]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-34364
[Link 24]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=34364#respond
[f350ff40e0f6e70d70d9a863e33b5c04_s_32]: https://secure.gravatar.com/avatar/f350ff40e0f6e70d70d9a863e33b5c04?s=32
[2013_01_7_ 10_20]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-25735
[Link 25]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=25735#respond
[a98bae61443716f9b45a32066275a0b8_s_32]: https://secure.gravatar.com/avatar/a98bae61443716f9b45a32066275a0b8?s=32
[2012_08_20_ 14_45]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-20600
[Link 26]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=20600#respond
[41e10e9f60d5af06c7456102931c4321_s_32]: https://secure.gravatar.com/avatar/41e10e9f60d5af06c7456102931c4321?s=32
[citier]: http://meiliangwu.com/
[2012_07_2_ 13_27]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-19030
[Link 27]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=19030#respond
[6a4a887b688cc1e52d903ed3a8de734b_s_32]: https://secure.gravatar.com/avatar/6a4a887b688cc1e52d903ed3a8de734b?s=32
[2012_06_12_ 11_59]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-18520
[Link 28]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=18520#respond
[3450dae7a9a6c3bfb1f4f4ccfa00e815_s_32]: https://secure.gravatar.com/avatar/3450dae7a9a6c3bfb1f4f4ccfa00e815?s=32
[2012_06_4_ 02_29]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-18277
[Link 29]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=18277#respond
[097bb32cddce1c455beb98bd708620ce_s_32]: https://secure.gravatar.com/avatar/097bb32cddce1c455beb98bd708620ce?s=32
[Link 30]: http://t.qq.com/deathfang
[2012_05_10_ 09_50]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-17736
[Link 31]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=17736#respond
[214a86b0fa69d2d083cb5c978b354806_s_32]: https://secure.gravatar.com/avatar/214a86b0fa69d2d083cb5c978b354806?s=32
[Link 32]: http://www.coolwinds.cn/
[2012_03_30_ 20_18]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-16931
[Link 33]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=16931#respond
[65e5148788772c0673f83ea46483ac16_s_32]: https://secure.gravatar.com/avatar/65e5148788772c0673f83ea46483ac16?s=32
[2012_03_20_ 01_28]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-16626
[Link 34]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=16626#respond
[5d8e65a7f0faf22de3cb651a2f4654db_s_32]: https://secure.gravatar.com/avatar/5d8e65a7f0faf22de3cb651a2f4654db?s=32
[2011_08_2_ 00_08]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-7543
[Link 35]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=7543#respond
[3e58242902fa8f33162f3f10df892c68_s_32]: https://secure.gravatar.com/avatar/3e58242902fa8f33162f3f10df892c68?s=32
[2011_08_2_ 19_54]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-7572
[Link 36]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=7572#respond
[6cff6e4eda891efefd445106e5d33bdb_s_32]: https://secure.gravatar.com/avatar/6cff6e4eda891efefd445106e5d33bdb?s=32
[2011_06_30_ 10_36]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-6722
[Link 37]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=6722#respond
[87841b76e695836d9d87ad16d8aaa4f9_s_32]: https://secure.gravatar.com/avatar/87841b76e695836d9d87ad16d8aaa4f9?s=32
[Link 38]: http://www.72-web.com/
[2011_06_3_ 16_32]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-6167
[Link 39]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=6167#respond
[6e00f8d447ef6c4bc9fc21a53b5a2745_s_32]: https://secure.gravatar.com/avatar/6e00f8d447ef6c4bc9fc21a53b5a2745?s=32
[2011_03_12_ 09_01]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-4103
[Link 40]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=4103#respond
[94a17497898cdc76db7ac1f47fb2785e_s_32]: https://secure.gravatar.com/avatar/94a17497898cdc76db7ac1f47fb2785e?s=32
[2011_02_28_ 15_53]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-3852
[Link 41]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=3852#respond
[994a1f9def6f0901441bba8724adf4d5_s_32]: https://secure.gravatar.com/avatar/994a1f9def6f0901441bba8724adf4d5?s=32
[Link 42]: http://twitter.com/ystarlongzi
[2010_12_30_ 13_26]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-2685
[Link 43]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=2685#respond
[37a2282eae010b010a950f587185295e_s_32]: https://secure.gravatar.com/avatar/37a2282eae010b010a950f587185295e?s=32
[Link 44]: http://lixinlixin2008.javaeye.com/
[2010_12_24_ 15_00]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-2407
[Link 45]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=2407#respond
[b1ac2e9e7c7d259d553ea72b193eb7ba_s_32]: https://secure.gravatar.com/avatar/b1ac2e9e7c7d259d553ea72b193eb7ba?s=32
[2010_12_20_ 20_15]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-2248
[Link 46]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=2248#respond
[c417fee2ade4b366168fc5f37ea54155_s_32]: https://secure.gravatar.com/avatar/c417fee2ade4b366168fc5f37ea54155?s=32
[wenbin]: http://wenbin.xialook.com/
[2010_12_15_ 21_39]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-2091
[Link 47]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=2091#respond
[3791e9a0099a0bfb98f2e6b01dbbbfe2_s_32]: https://secure.gravatar.com/avatar/3791e9a0099a0bfb98f2e6b01dbbbfe2?s=32
[bluemanta]: http://blog.orzlife.com/
[2010_11_30_ 10_36]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-1663
[Link 48]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=1663#respond
[4a3279b079e9ca6faac68073ffc8d34c_s_32]: https://secure.gravatar.com/avatar/4a3279b079e9ca6faac68073ffc8d34c?s=32
[lujun]: http://www.cnblogs.com/idche/
[2010_11_29_ 13_48]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-1644
[Link 49]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=1644#respond
[c79aacaab32084c8ade02ceb738ed783_s_32]: https://secure.gravatar.com/avatar/c79aacaab32084c8ade02ceb738ed783?s=32
[iifksp]: http://www.swordair.com/blog
[2010_11_28_ 01_31]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-1609
[Link 50]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=1609#respond
[dac67663e506cbdeb7bac75fffb91c4e_s_32]: https://secure.gravatar.com/avatar/dac67663e506cbdeb7bac75fffb91c4e?s=32
[freetao]: http://kainy.cn/
[2010_11_27_ 20_06]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-1608
[Link 51]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=1608#respond
[acfa95d66217654ed1a26c8afca62b58_s_32]: https://secure.gravatar.com/avatar/acfa95d66217654ed1a26c8afca62b58?s=32
[Link 52]: http://www.xinqdian.com/
[2010_11_26_ 10_42]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-1587
[Link 53]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=1587#respond
[2c1ed28062367029977b7b12d88ae753_s_32]: https://secure.gravatar.com/avatar/2c1ed28062367029977b7b12d88ae753?s=32
[Jankerli]: http://jankerli.com/
[2010_11_26_ 09_27]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/comment-page-1/#comment-1585
[Link 54]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/?replytocom=1585#respond
[zxx_90_0824.jpg]: http://photo.zhangxinxu.com/wp/zxx_90_0824.jpg
[more]: http://www.zhangxinxu.com/life/about/
[Link 55]: http://www.hust.edu.cn/
[ISUX]: http://isux.tencent.com/
[Link 56]: http://www.zhangxinxu.com/wordpress/?page_id=3720
[Link 57]: http://weibo.com/zhangxinxu
[Link 58]: http://t.qq.com/iamzhangxinxu
[graphic]: http://www.zhangxinxu.com/wordpress/category/graphic/
[as3]: http://www.zhangxinxu.com/wordpress/category/graphic/as3%e8%8f%9c%e5%8d%95/
[canvas]: http://www.zhangxinxu.com/wordpress/category/graphic/canvas-graphic/
[SVG 1]: http://www.zhangxinxu.com/wordpress/category/graphic/svg-graphic/
[js]: http://www.zhangxinxu.com/wordpress/category/js/
[jquery]: http://www.zhangxinxu.com/wordpress/category/js/jquery-about/
[js 1]: http://www.zhangxinxu.com/wordpress/category/js/js%e5%ae%9e%e4%be%8b/
[mobile]: http://www.zhangxinxu.com/wordpress/category/mobile%e7%9b%b8%e5%85%b3/
[ps]: http://www.zhangxinxu.com/wordpress/category/ps/
[web]: http://www.zhangxinxu.com/wordpress/category/web/
[Link 59]: http://www.zhangxinxu.com/wordpress/category/%e5%a4%96%e6%96%87%e7%bf%bb%e8%af%91/
[2015]: http://www.zhangxinxu.com/wordpress/2015/03/
[2015 1]: http://www.zhangxinxu.com/wordpress/2015/02/
[2015 2]: http://www.zhangxinxu.com/wordpress/2015/01/
[2014]: http://www.zhangxinxu.com/wordpress/2014/12/
[2014 1]: http://www.zhangxinxu.com/wordpress/2014/11/
[2014 2]: http://www.zhangxinxu.com/wordpress/2014/10/
[2014 3]: http://www.zhangxinxu.com/wordpress/2014/09/
[2014 4]: http://www.zhangxinxu.com/wordpress/2014/08/
[2014 5]: http://www.zhangxinxu.com/wordpress/2014/07/
[2014 6]: http://www.zhangxinxu.com/wordpress/2014/06/
[2014 7]: http://www.zhangxinxu.com/wordpress/2014/05/
[2014 8]: http://www.zhangxinxu.com/wordpress/2014/04/
[2014 9]: http://www.zhangxinxu.com/wordpress/2014/03/
[2014 10]: http://www.zhangxinxu.com/wordpress/2014/02/
[2014 11]: http://www.zhangxinxu.com/wordpress/2014/01/
[2013]: http://www.zhangxinxu.com/wordpress/2013/12/
[2013 1]: http://www.zhangxinxu.com/wordpress/2013/11/
[2013 2]: http://www.zhangxinxu.com/wordpress/2013/10/
[2013 3]: http://www.zhangxinxu.com/wordpress/2013/09/
[2013 4]: http://www.zhangxinxu.com/wordpress/2013/08/
[2013 5]: http://www.zhangxinxu.com/wordpress/2013/07/
[2013 6]: http://www.zhangxinxu.com/wordpress/2013/06/
[2013 7]: http://www.zhangxinxu.com/wordpress/2013/05/
[2013 8]: http://www.zhangxinxu.com/wordpress/2013/04/
[2013 9]: http://www.zhangxinxu.com/wordpress/2013/03/
[2013 10]: http://www.zhangxinxu.com/wordpress/2013/02/
[2013 11]: http://www.zhangxinxu.com/wordpress/2013/01/
[2012]: http://www.zhangxinxu.com/wordpress/2012/12/
[2012 1]: http://www.zhangxinxu.com/wordpress/2012/11/
[2012 2]: http://www.zhangxinxu.com/wordpress/2012/10/
[2012 3]: http://www.zhangxinxu.com/wordpress/2012/09/
[2012 4]: http://www.zhangxinxu.com/wordpress/2012/08/
[2012 5]: http://www.zhangxinxu.com/wordpress/2012/07/
[2012 6]: http://www.zhangxinxu.com/wordpress/2012/06/
[2012 7]: http://www.zhangxinxu.com/wordpress/2012/05/
[2012 8]: http://www.zhangxinxu.com/wordpress/2012/04/
[2012 9]: http://www.zhangxinxu.com/wordpress/2012/03/
[2012 10]: http://www.zhangxinxu.com/wordpress/2012/02/
[2012 11]: http://www.zhangxinxu.com/wordpress/2012/01/
[2011]: http://www.zhangxinxu.com/wordpress/2011/12/
[2011 1]: http://www.zhangxinxu.com/wordpress/2011/11/
[2011 2]: http://www.zhangxinxu.com/wordpress/2011/10/
[2011 3]: http://www.zhangxinxu.com/wordpress/2011/09/
[2011 4]: http://www.zhangxinxu.com/wordpress/2011/08/
[2011 5]: http://www.zhangxinxu.com/wordpress/2011/07/
[2011 6]: http://www.zhangxinxu.com/wordpress/2011/06/
[2011 7]: http://www.zhangxinxu.com/wordpress/2011/05/
[2011 8]: http://www.zhangxinxu.com/wordpress/2011/04/
[2011 9]: http://www.zhangxinxu.com/wordpress/2011/03/
[2011 10]: http://www.zhangxinxu.com/wordpress/2011/02/
[2011 11]: http://www.zhangxinxu.com/wordpress/2011/01/
[2010]: http://www.zhangxinxu.com/wordpress/2010/12/
[2010 1]: http://www.zhangxinxu.com/wordpress/2010/11/
[2010 2]: http://www.zhangxinxu.com/wordpress/2010/10/
[2010 3]: http://www.zhangxinxu.com/wordpress/2010/09/
[2010 4]: http://www.zhangxinxu.com/wordpress/2010/08/
[2010 5]: http://www.zhangxinxu.com/wordpress/2010/07/
[2010 6]: http://www.zhangxinxu.com/wordpress/2010/06/
[2010 7]: http://www.zhangxinxu.com/wordpress/2010/05/
[2010 8]: http://www.zhangxinxu.com/wordpress/2010/04/
[2010 9]: http://www.zhangxinxu.com/wordpress/2010/03/
[2010 10]: http://www.zhangxinxu.com/wordpress/2010/02/
[2010 11]: http://www.zhangxinxu.com/wordpress/2010/01/
[2009]: http://www.zhangxinxu.com/wordpress/2009/12/
[2009 1]: http://www.zhangxinxu.com/wordpress/2009/11/
[2009 2]: http://www.zhangxinxu.com/wordpress/2009/10/
[2009 3]: http://www.zhangxinxu.com/wordpress/2009/09/
[2009 4]: http://www.zhangxinxu.com/wordpress/2009/08/
[tip_ _CSS]: http://www.zhangxinxu.com/wordpress/2015/03/css-only-parallax-effect/
[position]: http://www.zhangxinxu.com/wordpress/2015/03/background-object-position-value-percent/
[tips_ CSS3 webkit]: http://www.zhangxinxu.com/wordpress/2015/03/css3-colorful-text/
[CSS3 object-position_object-fit]: http://www.zhangxinxu.com/wordpress/2015/03/css3-object-position-object-fit/
[tip_ _meta]: http://www.zhangxinxu.com/wordpress/2015/03/meta-http-equiv-refresh-content/
[border-collapse_table td_opacity]: http://www.zhangxinxu.com/wordpress/2015/03/border-collapse-table-td-border-opacity/
[CSS_height_100_height_inherit]: http://www.zhangxinxu.com/wordpress/2015/02/different-height-100-height-inherit/
[tip_ IE_zoom_Matrix]: http://www.zhangxinxu.com/wordpress/2015/02/ie-zoom-transform-filter/
[CSS_BFC]: http://www.zhangxinxu.com/wordpress/2015/02/css-deep-understand-flow-bfc-column-two-auto-layout/
[Link 60]: http://www.zhangxinxu.com/wordpress/2015/02/image-local-blur-background-attachment-fixed/
[jQuery powerFloat]: http://www.zhangxinxu.com/wordpress/2010/12/jquery-powerfloat%e4%b8%87%e8%83%bd%e6%b5%ae%e5%8a%a8%e5%b1%82%e4%b8%8b%e6%8b%89%e5%b1%82%e6%8f%92%e4%bb%b6/
[jQuery Pagination Ajax]: http://www.zhangxinxu.com/wordpress/2010/01/jquery-pagination-ajax%e5%88%86%e9%a1%b5%e6%8f%92%e4%bb%b6%e4%b8%ad%e6%96%87%e8%af%a6%e8%a7%a3/
[HTML5_Ajax]: http://www.zhangxinxu.com/wordpress/2011/09/%e5%9f%ba%e4%ba%8ehtml5%e7%9a%84%e5%8f%af%e9%a2%84%e8%a7%88%e5%a4%9a%e5%9b%be%e7%89%87ajax%e4%b8%8a%e4%bc%a0/
[IE6_png]: http://www.zhangxinxu.com/wordpress/2009/08/ie6%e4%b8%8bpng%e8%83%8c%e6%99%af%e4%b8%8d%e9%80%8f%e6%98%8e%e9%97%ae%e9%a2%98%e7%9a%84%e7%bb%bc%e5%90%88%e6%8b%93%e5%b1%95/
[-_display_inline-block]: http://www.zhangxinxu.com/wordpress/2010/11/%e6%8b%9c%e6%8b%9c%e4%ba%86%e6%b5%ae%e5%8a%a8%e5%b8%83%e5%b1%80-%e5%9f%ba%e4%ba%8edisplayinline-block%e7%9a%84%e5%88%97%e8%a1%a8%e5%b8%83%e5%b1%80/
[IE6_IE7_IE8_CSS3]: http://www.zhangxinxu.com/wordpress/2010/04/%e8%ae%a9ie6ie7ie8%e6%b5%8f%e8%a7%88%e5%99%a8%e6%94%af%e6%8c%81css3%e5%b1%9e%e6%80%a7/
[jQuery-_js]: http://www.zhangxinxu.com/wordpress/2009/08/jquery-%e5%be%88%e9%85%b7%e7%9a%84%e5%bc%b9%e5%87%ba%e5%b1%82%e6%95%88%e6%9e%9cjs%e6%8f%92%e4%bb%b6/
[Ajax Upload]: http://www.zhangxinxu.com/wordpress/2009/11/ajax-upload%e5%a4%9a%e6%96%87%e4%bb%b6%e4%b8%8a%e4%bc%a0%e6%8f%92%e4%bb%b6%e7%bf%bb%e8%af%91%e5%8f%8a%e4%b8%ad%e6%96%87%e6%bc%94%e7%a4%ba/
[mobilebone.js-mobile_web APP]: http://www.zhangxinxu.com/wordpress/2014/10/mobilebone-js-mobile-web-app-core/
[CSS3 transform_Matrix]: http://www.zhangxinxu.com/wordpress/2012/06/css3-transform-matrix-%e7%9f%a9%e9%98%b5/
[HTML5 video]: http://www.zhangxinxu.com/wordpress/2010/03/%e8%ae%a9%e6%89%80%e6%9c%89%e6%b5%8f%e8%a7%88%e5%99%a8%e6%94%af%e6%8c%81html5-video%e8%a7%86%e9%a2%91%e6%a0%87%e7%ad%be/
[ieBetter.js-_IE6-IE8_IE9_Chrome]: http://www.zhangxinxu.com/wordpress/2013/12/iebetter-js-make-ie6-ie8-like-modern-browser-ie9-chrome/
[CSS3 Transitions_ Transforms_Animation]: http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms%e5%92%8canimation%e4%bd%bf%e7%94%a8%e7%ae%80%e4%bb%8b%e4%b8%8e%e5%ba%94%e7%94%a8%e5%b1%95%e7%a4%ba/
[-]: http://www.zhangxinxu.com/wordpress/2014/04/%e6%94%af%e4%bb%98%e5%ae%9d%e6%8d%90%e8%b5%a0%e5%8e%86%e5%8f%b2-%e6%84%9f%e8%b0%a2%e5%a4%a7%e5%ae%b6%e7%9a%84%e6%94%af%e6%8c%81%e4%b8%8e%e9%bc%93%e5%8a%b1/
[zxxbox jQuery]: http://www.zhangxinxu.com/wordpress/2010/09/%e6%96%b0%e5%86%99%e7%9a%84%e6%97%a0%e5%9b%be%e7%89%87%e7%89%88zxxbox-jquery%e5%bc%b9%e5%87%ba%e6%a1%86%e6%8f%92%e4%bb%b6/
[CSS]: http://www.zhangxinxu.com/wordpress/2010/07/%e6%88%91%e6%98%af%e5%a6%82%e4%bd%95%e5%af%b9%e7%bd%91%e7%ab%99css%e8%bf%9b%e8%a1%8c%e6%9e%b6%e6%9e%84%e7%9a%84/
[CSS 1]: http://www.zhangxinxu.com/wordpress/2010/09/%e7%b2%be%e7%ae%80%e9%ab%98%e6%95%88%e7%9a%84css%e5%91%bd%e5%90%8d%e5%87%86%e5%88%99%e6%96%b9%e6%b3%95/
[Link 61]: http://www.zhangxinxu.com/wordpress/2009/09/%e5%85%b3%e4%ba%8e%e6%96%87%e5%ad%97%e5%86%85%e5%ae%b9%e6%ba%a2%e5%87%ba%e7%94%a8%e7%82%b9%e7%82%b9%e7%82%b9-%e7%9c%81%e7%95%a5%e5%8f%b7%e8%a1%a8%e7%a4%ba/
[jQuery powerSwitch_slide]: http://www.zhangxinxu.com/wordpress/2013/11/jquery-powerswitch-%e4%b8%87%e8%83%bd%e5%88%87%e6%8d%a2-slide-%e6%8f%92%e4%bb%b6/
[WordPress]: http://wordpress.org/
[ICP_09015569]: http://www.miibeian.gov.cn/
[zxx_ico.png]: /images/20210813/00eeab7129114d298183bfcc669ea6d5.png
[RSS]: http://www.zhangxinxu.com/wordpress/?feed=rss2
[Link 62]: http://www.zhangxinxu.com/wordpress/wp-login.php