Home / animate / api / options / end-delay

endDelay

DefaultType
0Number | TypeCallback

Similar to delay but it indicates the number of milliseconds to delay after the full animation has played not before.

Note: endDelay will delay the onfinish method and event, but will not reserve the finished state of the CSS animation, if you need to use endDelay you may need to use the fillMode property to reserve the changes to the animation target.

// First element fades out but then after 1s finishes, the second element after 2s, etc.
animate(ASTRO_ESCAPED_LEFT_CURLY_BRACKET
    target: ".div",
    easing: "linear",
    endDelay: 1000,
    // or
    endDelay: (index) => (index + 1) * 1000,
    opacity: [1, 0],
});