Nos bénévoles n'ont pas encore traduit cet article en Français. Inscrivez-vous et aidez-nous à réaliser cette tâche !
Vous pouvez également lire cet article en English (US).

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The CSSKeyframesRule interface describes an object representing a complete set of keyframes for a CSS animation. It corresponds to the contains of a whole @keyframes at-rule. It implements the CSSRule interface with a type value of 7 (CSSRule.KEYFRAMES_RULE).

Properties

As a CSSRule, CSSKeyframesRule also implements the properties of these interfaces. It has two properties :

CSSKeyframesRule.name
Represents the name of the animation, used by the animation-name property.
CSSKeyframesRule.cssRules Read only
Returns a CSSRuleList of the CSS rules in the media rule.

Methods

As a CSSRule, CSSKeyframesRule also implements the methods of that interface. It has three specific methods:

CSSKeyframesRule.appendRule()
Inserts a new keyframe rule into the current CSSKeyframesRule. The parameter is a DOMString containing a keyframe in the same format as an entry of a @keyframes at-rule. If it contains more than one keyframe rule, a DOMException with a SYNTAX_ERR is thrown.
CSSKeyframesRule.deleteRule()
Deletes a keyframe rule from the current CSSKeyframesRule. The parameter is the index of the keyframe to be deleted, expressed as a DOMString resolving as a number between 0% and 100%.
CSSKeyframesRule.findRule()
Returns a keyframe rule corresponding to the given key. The key is a DOMString containing an index of the keyframe to be returned, resolving to a percentage between 0% and 100%. If no such keyframe exists, findRule returns null.

Specification

Specification Status Comment
CSS Animations
The definition of 'CSSKeyframesRule' in that specification.
Working Draft Initial definition

Browser compatibility

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support Yes Yes

48

5 moz

1012 -o 4
appendRule

Yes

Yes — 451

?

22

5 — 221

101 Yes1 Yes1
cssRules ? ? ? ? ? ?
deleteRule ? ? ? ? ? ?
findRule ? ? ? ? ? ?
name ? ? ? ? ? ?
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support Yes Yes Yes

48

5 moz

12 -o Yes ?
appendRule

Yes

Yes — 451

Yes

Yes — 451

?

22

5 — 221

Yes1 Yes1 ?
cssRules ? ? ? ? ? ? ?
deleteRule ? ? ? ? ? ? ?
findRule ? ? ? ? ? ? ?
name ? ? ? ? ? ? ?

1. Supported as insertRule.

See also

Étiquettes et contributeurs liés au document

Dernière mise à jour par : dom96,