This article needs to be updated.(July 2017)
|CSS Animations Level 1|
|Status||W3C Working Draft|
|First published||20 March 2009|
|Latest version||Level 1|
March 2, 2023
|Preview version||Level 2|
March 2, 2023
|Organization||World Wide Web Consortium|
|Committee||CSS Working Group|
|Cascading Style Sheets|
CSS animations is a proposed module for Cascading Style Sheets that allows the animation of HTML document elements using CSS.
While the pseudo-class
:hover has been used to generate rudimentary animations for years, extensions of CSS into the realm of animation were minimal until the late 2000s decade. As early as 2007, WebKit had announced its intent to include CSS animation, transitions, and transforms as features of WebKit. It also announced the implementation of both implicit and explicit animation through CSS in February 2009. CSS animation has also been put forth as a feature of CSS3, the ongoing draft specification managed by the World Wide Web Consortium (W3C).
Scalable Vector Graphics
In addition to hover, Scalable Vector Graphics supports the @keyframes at-rule, allowing a limited set of transformations to be animated. Firefox and Chrome used the @-moz-keyframes and @-webkit-keyframes extensions, respectively, before @keyframes was added to the CSS 3 specification.
As of June 2011, Firefox 5 includes CSS animations support. CSS animation is also available as a module in the nightly builds of WebKit as well as Google Chrome, Safari 4 and 5 and Safari for iOS (iPhone, iPod Touch, iPad), Android versions 2.x and 3.x, Internet Explorer 10+ and Microsoft Edge browser, the BlackBerry OS 6 web browser, with the
-webkit- prefix. It is also used in iTunes 9 to support iTunes LP files.
- ^ "CSS Animations Level 1 Publication History - W3C". W3C. n.d. Retrieved 2021-04-09.
- ^ a b c Jackson, Dean; Baron, L. David; Atkins Jr., Tab; Birtles, Brian; Hyatt, David; Marrin, Chris; Galineau, Sylvain, eds. (2023-03-02). "CSS Animations Level 1". W3C. CSS Working Group. Retrieved 2023-03-26.
- ^ Baron, L. David; Birtles, Brian, eds. (2023-03-02). "CSS Animations Level 2". CSS Working Group Editor Drafts. Retrieved 2023-03-26.
- ^ Mozilla Firefox Release Notes, The Mozilla Foundation, 2011-06-21, archived from the original on 2014-02-12, retrieved 2021-04-09
- ^ Hyatt, Dave (2007-10-31), "CSS Animation | WebKit", WebKit, Surfin’ Safari, retrieved 2021-04-09
- ^ Jackson, Dean (2009-02-05), "CSS Animation | WebKit", WebKit, Surfin’ Safari, retrieved 2021-04-09
- ^ "@keyframes rule (Internet Explorer)", Microsoft Docs, Microsoft, 2018-11-25, archived from the original on 2018-11-26, retrieved 2021-04-09
- ^ Snook, Jonathan (2007-10-31), CSS Animations in Safari, Snook.ca, archived from the original on 2021-01-27, retrieved 2021-04-09
- ^ Kim, Arnold (2009-02-06), CSS Animation Coming to Safari, Already in iPhone. Less Dependence on Flash?, MacRumors.com, retrieved 2021-04-09
- ^ Palmer, Robert (2009-02-06), CSS Animation to replace need for Flash in MobileSafari? Not likely, The Unofficial Apple Weblog, archived from the original on 2009-02-09, retrieved 2021-04-09
- ^ Ferrari, Vincent (2009-02-09), CSS Animations: A Flash Substitute?, Apple Thoughts, retrieved 2021-04-09
- ^ ButtonAnimations (2019-12-11). "Button Animations CSS (w/ code)". ButtonAnimations. Retrieved 2021-04-09.