Shift between two CSS values in style and save time with the transition shorthand:
transition: margin-top 1s ease-in-out 0.5s;
Is equivalent to this:
transition-property: margin-top;
transition-duration: 1s;
transition-timing-function: ease-in-out;
transition-delay: 0.5s;
Use all as the property to affect all values at once. Define multiple transitions in the shorthand using comas:
.box {
transition: margin-top 1s linear,
margin-bottom 0.5s cubic-bezier(0,1.18,.87,.32),
margin-left 2s;
}
Join our DigitalOcean community of over a million developers for free! Get help and share knowledge in our Questions & Answers section, find tutorials and tools that will help you grow as a developer and scale your project or business, and subscribe to topics of interest.
Sign up