KeyframeEffectReadOnly.target

This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for usage in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the specification changes.

The target property of a KeyframeEffectReadOnly or a KeyframeEffect interface represents the element or pseudo-element being animated. It may be null for animations that do not target a specific element. It performs as both a getter and a setter, except with animations and transitions generated by CSS.

Note: For KeyframeEffect, this property is both a getter and a setter. For KeyframeEffectReadOnly, it is read-only.

Syntax

var targetElement = document.getElementById("elementToAnimate");
var keyframes = new KeyframeEffect( targetElement, keyframeBlock, timingOptions );
// returns #elementToAnimate
keyframes.target;
// assigns keyframes a new target
keyframes.target = newTargetElement;

Value

An Element or null.

Examples

In the Follow the White Rabbit example, whiteRabbit sets the target element to be animated:

var whiteRabbit = document.getElementById("rabbit");
var rabbitDownKeyframes = new KeyframeEffect(
  whiteRabbit,
  [
    { transform: 'translateY(0%)' }, 
    { transform: 'translateY(100%)' }
  ],
  { duration: 3000, fill: 'forwards' }
);
// returns <div id="rabbit">Click the rabbit's ears!</div>
rabbitDownKeyframes.target;

Specifications

Specification	Status	Comment
Web Animations The definition of 'keyframeEffect' in that specification.	Working Draft	Editor's draft.

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari (WebKit)
Basic support	No support	No support	No support	No support	No support

Feature	Android	Android Webview	Chrome for Android	Firefox Mobile (Gecko)	Firefox OS	IE Mobile	Opera Mobile	Safari Mobile
Basic support	No support	No support	No support	No support	No support	No support	No support	No support

Syntax

Value

Examples

Specifications

Browser compatibility

See also

Document Tags and Contributors