Diese Übersetzung ist unvollständig. Bitte helfen Sie, diesen Artikel aus dem Englischen zu übersetzen.

Dies ist eine experimentelle Technologie
Da diese Technologie noch nicht definitiv implementiert wurde, sollte die Browserkompatibilität beachtet werden. Es ist auch möglich, dass die Syntax in einer späteren Spezifikation noch geändert wird.

CSS Animations is a module of CSS that defines how to animate the values of CSS properties over time, using keyframes. The behavior of these keyframe animations can be controlled by specifying their duration, their number of repetitions, and how they repeat.

Reference

CSS Properties

CSS At-rules

Guides

Detecting CSS animation support
Describes a technique for detecting if the browser supports CSS animations.
Using CSS animations
Step-by-step tutorial about how to create animations using CSS, this article describes each relevant CSS property and at-rule and explains how they interact.

Specifications

Specification Status Comment
CSS Animations Arbeitsentwurf Initial definition.

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidEdge MobileFirefox für AndroidOpera für AndroidSafari auf iOSSamsung Internet
Grundlegende UnterstützungChrome Vollständige Unterstützung 43
Vollständige Unterstützung 43
Vollständige Unterstützung Ja
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Edge Vollständige Unterstützung 12
Vollständige Unterstützung 12
Vollständige Unterstützung 12
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Firefox Vollständige Unterstützung 16
Vollständige Unterstützung 16
Vollständige Unterstützung 49
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Vollständige Unterstützung 44
Mit Präfix Deaktiviert
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Deaktiviert From version 44: this feature is behind the layout.css.prefixes.webkit preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Vollständige Unterstützung 5
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -moz-
IE Vollständige Unterstützung 10Opera Vollständige Unterstützung 30
Vollständige Unterstützung 30
Vollständige Unterstützung 15
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Keine Unterstützung 12.1 — 15
Keine Unterstützung 12 — 15
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -o-
Safari Vollständige Unterstützung Ja
Vollständige Unterstützung Ja
Vollständige Unterstützung 4
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
WebView Android Vollständige Unterstützung Ja
Vollständige Unterstützung Ja
Vollständige Unterstützung 2
Mit Präfix Hinweise
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Hinweise The animation-fill-mode property is not supported in Android browsers below 2.3.
Chrome Android Vollständige Unterstützung 43
Vollständige Unterstützung 43
Vollständige Unterstützung Ja
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Edge Mobile Vollständige Unterstützung Ja
Vollständige Unterstützung Ja
Vollständige Unterstützung Ja
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Firefox Android Vollständige Unterstützung 16
Vollständige Unterstützung 16
Vollständige Unterstützung 49
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Vollständige Unterstützung 44
Mit Präfix Deaktiviert
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Deaktiviert From version 44: this feature is behind the layout.css.prefixes.webkit preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Vollständige Unterstützung 5
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -moz-
Opera Android Vollständige Unterstützung 30
Vollständige Unterstützung 30
Vollständige Unterstützung 15
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Keine Unterstützung 12.1 — 14
Keine Unterstützung 12 — 14
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -o-
Safari iOS Vollständige Unterstützung Ja
Vollständige Unterstützung Ja
Vollständige Unterstützung Ja
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-
Samsung Internet Android Vollständige Unterstützung 4.0
Vollständige Unterstützung 4.0
Vollständige Unterstützung Ja
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -webkit-

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Siehe Implementierungshinweise.
Siehe Implementierungshinweise.
Benutzer muss dieses Feature explizit aktivieren.
Benutzer muss dieses Feature explizit aktivieren.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.

See also

  • Related to CSS Animations, CSS Transitions can trigger animations on user actions.

Schlagwörter des Dokuments und Mitwirkende

Mitwirkende an dieser Seite: SJW, teoli
Zuletzt aktualisiert von: SJW,