Time delay for animations
HI everyone
I want make this animation but without gsap only with css
I want the title appear first after the image after the other lines step by step
but something is going wrong with my work
can I got some Idea
https://www.youtube.com/watch?v=QiqSE2XcyDo&list=LL&index=2&t=619s
https://codepen.io/alpha_66/pen/wvYLbOm
thanks by advance.
DesignCourse
YouTube
The Most Popular UI/UX Animation Technique
https://bit.ly/43cehy9 👈 Design like me. Use "UI2023" for 23% Off!
https://bit.ly/3ZLBchj 👈 Project files
https://designcourse.com/af 👈 My upcoming "Advanced Frontends" Course
-- Today, I'm going to show you 7 different levels of UI/UX animation complexity. These will involve the usage of CSS animations, as well as JavaScript animations with the...
5 Replies
you're probably looking for https://developer.mozilla.org/en-US/docs/Web/CSS/transition-delay
oh, I see you're using animations and animation-delay
Your
calc
isn't valid:you need a space between - and 300 in
-300ms
though tbh, I'd suggest doing the math yourself instead of writing it out like this, or using something like
--animation-base-time
and --animation-step-time
variables to make it more readable:thanks