现在的位置: 首页 > 综合 > 正文

[原]CSS  Animate 动画实现结束后…

2018年08月30日 ⁄ 综合 ⁄ 共 554字 ⁄ 字号 评论关闭
道理很简单,看代码
@-webkit-keyframes btnActive {
0% {
background-color:#999;
color:#FFFFFF;
}
100% {
background-color:#e6e6e6;
color:#999;
}
}
#formLogin input[type=button]:active {
-webkit-animation-name:btnActive;
-webkit-animation-duration:0.3s;
-webkit-animation-timing-function:linear;
background-color:#e6e6e6;
position:relative;
top:1px;
color:#999;
}
或者,设置-webkit-animation-fill-mode为forwards

兼容性:


  • 浅绿
     = 支持

  • 红色
     = 不支持

  • 墨绿
     = 部分支持

  • 橙色
     = 实验性质
支持版本\类型
IE

Firefox

Safari

Chrome

Opera
版本 6.0-9.0 4.0 5.1 13.0-16.0 11.50-11.60
版本 10.0 5.0-9.0

详细见css手册:http://css.doyoe.com/properties/animation/animation-fill-mode.htm

抱歉!评论已关闭.