Search code examples
csscss-transitionscss-transforms

Is it possible to set different duration/delay for transform options?

I want to set several transform options for my html object but with different duration and delay.

If i try to use something like that:

-webkit-transition: -webkit-transform, opacity;
-webkit-transform: rotate(180deg) scale(2); 
-webkit-transition-duration: 2000ms, 6000ms; 
-webkit-transition-delay: 0ms, 6000ms;

Then i will have different time function for transform and opacity but can i set different options for rotate and scale, e.g. rotate for 10s and scale 20s?

Solution

  • Probably not directly, but the same effect can be achieved by nesting elements.