Why is it not possible to use transform: translateZ on svg path element?
Asked Answered
F

0

7

I'd like to animate parts of an inline svg element. I think it is really cool that you can use css transforms on the svg path elements, and thereby animate parts of the svg. But after playing around with it, I have run into an issue with the translateZ function. For some reason using the 3rd dimension on path elements doesn't seem to work?

Does any one know why this is? it works fine on the svg element, but not on the path elements with a class name. I did a small demo here to illustrate the problem: http://codepen.io/anon/pen/uFEhp

Any clue as to why this is?

Foreigner answered 22/4, 2014 at 21:7 Comment(3)
SVG doesn't support 3D transforms, just 2D.Asparagus
But it does seem to work on the svg element though?Foreigner
That's because by the time you are transforming it, it has now effectively been rendered as a bitmap.Punchdrunk

© 2022 - 2024 — McMap. All rights reserved.