本文介绍了css3动画逐帧的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我需要做一个动画逐帧改变一个元素的背景位置。我需要这样做没有宽松或线性动画,只是改变背景位置。是否可以用css3动画实现?

I need to do an animation frame-by-frame changing a background-position of an element. I need to do this WITHOUT easing or linear animation, just changing the background-position. Is it possible to achieve with css3 animation?

谢谢!

推荐答案

是的,它是通过新的step-function缓动的曲线属性。

Yes it is via the new step-function easing curves property.

使用step-start或step-end而不是ease-in等,这将使转换瞬间发生在开始或结束

Instead of "ease-in" etc. use "step-start" or "step-end" which will make the transition happen instantaneously either at the beginning or end of the time period specified in transition-duration.

您还可以有多个步骤:steps(N,start | end]),这将导致转换同样发生间隔的步骤。

You can also have multiple steps: "steps(N, start | end ])" which will have the transition happen in equally spaced steps.

AFAIK这项功能目前仅支援Chrome。

AFAIK this is only supported in Chrome to date.

这篇关于css3动画逐帧的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-12 08:27