Answers for "add delay to animation css"

CSS
2

css animation delay

/* Answer to: "css animation delay" */

/*
  The animation-delay property specifies a delay for the start of an animation.
*/

div {
  animation-delay: 2s;
}
Posted by: Guest on June-29-2020
-1

animation delay in css

if you have many element, whcih you want to make nice animation effact. then you 
just use same time, like all will be 2s, and make animation delay by growing like, first is 1s, second is 1.5s ... ... ... , then it will give you nice animation like tide :)


// In Example;

.s1 { animation: scale infinite linear 3s; animation-delay: 1.1s ; }
.s2 { animation: scale infinite linear 3s; animation-delay: 1.2s ; }
.s3 { animation: scale infinite linear 3s; animation-delay: 1.3s ; }
.s4 { animation: scale infinite linear 3s; animation-delay: 1.4s ; }
.s5 { animation: scale infinite linear 3s; animation-delay: 1.5s ; }
.s6 { animation: scale infinite linear 3s; animation-delay: 1.6s ; }
.s7 { animation: scale infinite linear 3s; animation-delay: 1.7s ; }
.s8 { animation: scale infinite linear 3s; animation-delay: 1.8s ; }
.s9 { animation: scale infinite linear 3s; animation-delay: 1.9s ; }
.s10{ animation: scale infinite linear 3s; animation-delay: 2.0s ; }
.s11{ animation: scale infinite linear 3s; animation-delay: 2.1s ; }
Posted by: Guest on May-25-2021

Browse Popular Code Answers by Language