CSS3 transition scale, but not translation

I couldn't find an answer to this anywhere, probably because it doesn't exist, but anyway:

Instead of defining transition-property: transform, can you define transitions for translation and scaling independently?

Currently I got the following definition:

.logo {
    position: absolute;
    -webkit-transition: -webkit-transform 1s ease-out;


So when I set "-webkit-transform" to "scale ($ s) translate3D ($ x, $ y, $ z)" (with $ s, etc. being arbitrary values), both are animated, but I just want the scale to be ...

Thanks for any tips in advance!


source to share

1 answer

A hacky way to solve this is to use a wrapper element and put a translation on that element.



All Articles