One Hundred Years of Solitude

扬帆,启航!

C3-过渡transition属性

transition是css3新增属性,可不用JavaScript、jQuery、flash等实现一些动画

transition:简写属性,一共4个值:
transition-property:css属性名,width、height…;
transition-duration:过渡需要花费的时间,默认为0;

transition-timing-function:运动曲线共6个值:
linear(匀速)
ease(慢速开始,然后加快,慢速结束)
ease-in(慢速开始)
ease-out(慢速结束)
ease-in-out(慢速开始,慢速结束)
cubic-bezier(cubic-bezier函数中自定义值)默认为ease

transition-delay:定义何时执行过渡,默认为0,无延时。

推荐一个cubic-bezier可视化网站:http://cubic-bezier.com

点赞

发表评论

电子邮件地址不会被公开。