CSS Animations

CSS animation is a module for Cascading Style Sheets ( CSS) that allows the animation of XML elements.

History

Animations on web pages based on CSS was not possible until the late 2000s. You could only be implemented by client-side scripting languages ​​such as JavaScript. In 2007, WebKit developer announced to make CSS animations in Webkit browsers. In addition, it was announced in February 2009 that both implicit and explicit animations to be made ​​possible by CSS. CSS animations are part of CSS3, a current working draft of the W3C.

Syntax

The application is done in two steps. First, an animation is defined with any number of keyframes. Later this a selector is assigned. In this case, additional parameters such as duration of the animation sequence or direction can be specified.

/ / Define a simple keyframe animation @ keyframes fade - in {    0% {opacity: 0}    100 % {opacity: 1} }   / / Application a {    animation: fade - in 1s; } browser Support

Since June 2011, Firefox 5 includes support for CSS animations. CSS animations are also since 2007 in the nightly builds of WebKit, Google Chrome, Safari, Android 2.x and 3.x and the RIM OS6 web browser with the -webkit - prefix as a module available. The Internet Explorer to display CSS animations in version 10 or able. In addition, the animation module from iTunes can be used 9 to represent multimedia elements of music files.

Criticism

The specification of CSS animations has, SMIL animations triggered concern among proponents of JavaScript animations or less pronounced; others see it as a train of Apple, the main sponsor of the WebKit project to ( and the prevailing flash animations ) to avoid the inclusion of Adobe Flash in the iOS product line of mobile phones, which use the Internet browser Safari.

Swell

208527
de