css3中transition和animation都能够实现动画效果，所谓动画本质就是物体的一种状态变换成另外一种状态的过程呈现，我们可以结合2D或者3D变换做出很多酷炫的动画，下面针对这四部分分别做一个用法上的小结。一、Transition过渡1.定义过渡动画：是从一个状态渐渐地过渡到另外一个状态经常:hover等等一起搭配使用，也就是说一般会经过一个动作触发之后，再进行变换。2.用法transition:要过渡的属性花费时间运动曲线何时开始;属性：想要变换的css属性，宽度、高度、背景颜色、内外边距都可以，如果想要所有的属性都变化过渡。花费时间：单位是秒（必须写单位）比如0.5s运动曲线：

css3中transition和animation都能够实现动画效果，所谓动画本质就是物体的一种状态变换成另外一种状态的过程呈现，我们可以结合2D或者3D变换做出很多酷炫的动画，下面针对这四部分分别做一个用法上的小结。一、Transition过渡1.定义过渡动画：是从一个状态渐渐地过渡到另外一个状态经常:hover等等一起搭配使用，也就是说一般会经过一个动作触发之后，再进行变换。2.用法transition:要过渡的属性花费时间运动曲线何时开始;属性：想要变换的css属性，宽度、高度、背景颜色、内外边距都可以，如果想要所有的属性都变化过渡。花费时间：单位是秒（必须写单位）比如0.5s运动曲线：

WebKit(iPad)CSS3:Backgroundtransitionflickers在Safari/WebKit中通过CSS3动画改变背景颜色时遇到问题，特别是在iPad上。附上两张截图来说明问题。图1图2如果我选择一种颜色，内圈应该从当前颜色淡化为新选择的颜色。但是你可以看到在动画过程中有非常奇怪的方块。最重要的是整个应用程序的背景颜色(背景DIV)也以选定的颜色着色。但这里并非完全不透明。非常轻松通过：1$('#bgWrapper').css('background','rgba(XX,XX,XX,0.1)');这个元素完美地淡化了颜色——当我切换到完全不透明时也是如此。圆圈元素(d

WebKit(iPad)CSS3:Backgroundtransitionflickers在Safari/WebKit中通过CSS3动画改变背景颜色时遇到问题，特别是在iPad上。附上两张截图来说明问题。图1图2如果我选择一种颜色，内圈应该从当前颜色淡化为新选择的颜色。但是你可以看到在动画过程中有非常奇怪的方块。最重要的是整个应用程序的背景颜色(背景DIV)也以选定的颜色着色。但这里并非完全不透明。非常轻松通过：1$('#bgWrapper').css('background','rgba(XX,XX,XX,0.1)');这个元素完美地淡化了颜色——当我切换到完全不透明时也是如此。圆圈元素(d