KeyframeEffect: target property
The target
property of 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.
Value
An Element
or null
.
Examples
In the Follow the White Rabbit example, whiteRabbit
sets the target
element to be animated:
js
const whiteRabbit = document.getElementById("rabbit");
const 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 |
---|
Web Animations # dom-keyframeeffect-target |
Browser compatibility
BCD tables only load in the browser
See also
- Web Animations API
- Property of
KeyframeEffect
objects.