I know, Web apps are so 2008... but this is just for my site, not a real app Despite following numerous examples, my 3D CSS animations for iPhone WebKit all lack perspective. I wrap the animated elements in a <div> with: Code: -webkit-transform-style: preserve-3d; -webkit-perspective: 500; And for good measure, I put those same properties on the divs that are being directly animated. No good--things don't look smaller with distance. No perspective. Any thoughts? Thanks in advance.
Weird but it works Well, after hours of struggling, I solved it just after posting... why does that happen? It may be a bug or something, but I worked around it. In case it helps someone else, this seems to be the explanation: * I had a div spinning in space, containing other divs, all laid out flat in a common plane. No 3D variation within that plane; still, the whole plane of images should show perspective as it spins! But it didn't. * As soon as I added a little X or Y rotation to even ONE of the individual inner divs, the whole scene gained perspective. That seems wrong--the original rotation WAS in 3D, and so it ought to show perspective no matter whether the divs inside are in a single plane or not. (And my perspective tags were wrapped in a separate div around that animation--so its children should have shown perspective.) But it works now, so I'm good.