animate-css
--animate-delay for each element?
Describe The Bug
From the docs, we can set
--animate-duration: 0.7s;
per each element, but let me know if we able to do the same for
--animate-delay: 10s;
right now it only works for :root
Steps To Reproduce
Try to set for you single animated element this
--animate-duration: 0.7s;
--animate-delay: 10s;
Expected Behavior
Animation will start in 10 seconds.
Screenshots
Desktop
- iOs
- Chrome
Smartphone
No response
Additional Context
No response
👋 Hey @jack-fdrv, in Animate.css documentation delayed animation doesn't work. I checked source code animate.css version 4.1.1 (the latest version) and noticed that (--animate-delay) variable no longer exists. Instead, try using (--animation-delay: 10s) and (-webkit-animation-delay: 10s) this way you'll get delayed animation working for most browsers. If this answer helped you, please mark it as answer and I'll be very grateful 😀
Sorry @thelabuzov, but this info is not correct, we do have and use that variable and the documentation is correct.
I'll check if it's working as it should as might there be a CSS custom property quirk that we might have missed and is blocking the variable from being overridden.
@eltonmesquita I can confirm that --animate-delay and --animate-repeat doesn't work for the elements, only --animate-duration works. Moreover classes like animate__delay-2, animate__repeat-2 doesn't work also. Seems like a serious bug in v4.1.1.
