求CSS3动画的一个写法

[wz_307]

现在有一个动画定义

@-webkit-keyframes move1{
  from{
    font-size:12px;
  }
  to{
    font-size:24px;
  }
}

#str{
  -webkit-animation-name: move1;
  
  -webkit-animation-duration:2s;
  -webkit-animation-iteration-count: infinite;
  /*
  现在问题在这里, 
  -webkit-animation-timing-function: 的设置, 它的默认是三次贝塞尔曲线方程, 所以说元素的font-size变形是从12px渐变到24px的, 如何能够不进行渐变, 直接切换到24px呢?
  不使用javascript, 直接进行关键帧的跳变而不是渐变. 不知是否有人能帮我一下
  或者不用-animation也可以, 直接用其它途径的CSS3定义, 能否直接跳变呢?
  再强调一下不使用js
  */
}

[wz_307]

[Quote=引用 4 楼 net_lover 的回复:]

你的意思是12px和24px之间直接切换？
[/Quote]
是的, 直接引发animation的回调

[wz_307]

[Quote=引用 4 楼 net_lover 的回复:]

你的意思是12px和24px之间直接切换？
[/Quote]
不执行动画渐变, 直接跳变fontsize.
之前在找到一个做法,
形如:
0%{font-size:12px;}
99%{font-size:12px;}
100%{font-size:24px;}
但是这还是执行了渐变函数,

实际项目中, 我需要做的是不断快速切换div的background-position-left(如同动画片原理), 如果使用上述方法, 在大量重复的情况下浏览器还是会有图片横向滑动执行的痕迹. 所以我希望能够利用CSS3中时间轴上的关键帧, 直接越过渐变, 直接触发其回调, 不知大版主是否有方法

[抽疯的小毛驴]

这么高深，汗。

[幕子丿昔]

抽空也要学学CSS3啊 不然要落伍了

[孟子E章]

你的意思是12px和24px之间直接切换？

[wz_307]

再顶一次, 希望有人能解决一下.

[wz_307]

再顶一次. 一个遗留问题

[mayong772]

试了几种方法都无法直接用CSS写出你要的效果。