CSS转换属性分别翻译

Question

What I'd like to do is use a transition on an objects transform, but have separate delays for translate() and scale()

Something to the effect of:

transition: transform:scale() 2s 0s ease, transform:translate() 2s 2s ease

This doesn't seem possible, but wanted to ask the masses.

Alternatives could be using animation key-frames, or applying separate classes with two different transitions.

Answer 1

@-webkit-keyframes animIn
{
0%   {-webkit-transform:translateX(-1920px) scale(0.8);opacity:0;}
1%   {-webkit-transform:translateX(-1920px) scale(0.8);opacity:1;}
33%  {-webkit-transform:translateX(-1920px) scale(0.8);opacity:1;}
66%  {-webkit-transform:translateX(0px)     scale(0.8);opacity:1;}
100% {-webkit-transform:translateX(0px)     scale(1.0);opacity:1;}
}

The answer was to switch to an animation approach.