Hello People.
I'am Using Web Animations API To Create Animations On My Web Page,This API Has A Similar Syntax To This:
element.animate([
{css_property:value},
{css_property_2:value_2},
{css_property_3:value_3} //And So On..
],{
duration:value, //In Milliseconds
iterations:value, //An Integer
easing:value //linear,ease-in,ease-out,cubic-bezier,etc...
});
So I Was Wondering About How To Use These Keyframes In Such A Way That;
/* In CSS */
@keyframes test
{
0% {property_1:value_1}
20% {property_2:value_2}
100% {property_3:value_3}
}
/* If You Know What I Mean About Percentage */
How Can I Make Web Animations API Run The First Keyframe At 0% And The Second At 20% And The Third At 100%?
Thanks For Your Patience...