W3C home > Mailing lists > Public > www-style@w3.org > January 2010

[css3-animation] keyframes without animations

From: Andras Nemeseri <andris@nemeseri.com>
Date: Mon, 11 Jan 2010 17:59:53 +0100
Message-ID: <2c2719261001110859g5f7d1695mcde153aa3fc9f6f0@mail.gmail.com>
To: www-style@w3.org
How can I define "keyframes" without animation?
I don't want an "animation-timing-function" controlled animation, instead I
would like to simply change CSS properties in the key frames (without any
animation effects).

It would be usable if the "animation-timing-function" property had a "none"
value.

# @keyframes 'frames' {
#
#     from {
#         top: 0;
#         animation-timing-function: none;
#     }
#
#     50% {
#         top: 50px;
#         animation-timing-function: none;
#     }
#
#     to {
#         top: 150px;
#     }
#
# }

In the upper case, the "animated" element would jumps from 0 to  50px, then
from 50px to 150px without any animation.

Is there any CSS based solution to this problem? (or do I still need
javascript to do a simple 3 (or more) step CSS value change?)

Thanks,
Andras Nemeseri
Received on Monday, 11 January 2010 17:53:20 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:23 GMT