Questions tagged [preserve-3d]

9 questions
5
votes
0 answers

React-native transform style preserve 3d

I'm trying to recreate this 3D animation in react-native. Everything is fine, but the problem is that react-native doesn't have transform-style: preserve-3d. Is there any alternative/polyfill to this or how can I accomplish my goal without using…
Deepsy
  • 3,769
  • 7
  • 39
  • 71
2
votes
1 answer

Preserve 3d not working on ie11

I'm trying to implement a flip on an image but its preserve 3d (or probably backface-visibility) is not working on ie11. This solution didn't work for me: -webkit-transform-style: preserve-3d not working Here is a pen for you to try stuff and also a…
Vandervals
  • 5,774
  • 6
  • 48
  • 94
1
vote
0 answers

Why Does Text Blur on 3D Rotation in React?

I'm creating an image carousel for React that I style and rotate using the code found here: https://3dtransforms.desandro.com/carousel When I first load the carousel things are nice and clear, but as soon as I rotate it, everything blurs (even once…
Elliptica
  • 3,928
  • 3
  • 37
  • 68
1
vote
1 answer

How can I get translateZ to work in svg groups?

I have created a svg image animation. I am trying to make some nice effects with mouseover. I want to move the svg depending on mouse position. The rotate part works fine so far. But I also want to move the inside the svg in z-axis (popout) so…
JoakimB
  • 157
  • 1
  • 11
1
vote
0 answers

css 3d transform page flip effect - controling the transition

Everything works fine but if you look closely after clicking on it the transition is ok till the mid point and then it snaps to place.And if you click again the reverse flip snaps to the middle point and then the transition is ok. And also if you…
Wahid Polin
  • 101
  • 13
0
votes
1 answer

Why 'backface-visibility: hidden' does not work with text?

This is supposed to be a memory game with cards with text on them. The cards on the front should just be white (the background-image) and at the back there is a word. But since applying the backface-visibility-hidden, it actually just shows the…
Timi Xi
  • 7
  • 3
0
votes
1 answer

preserve-3d isn't working on child element

I'm using google chrome and React.js. EDIT: Here is a jsfiddle with plain css: https://jsfiddle.net/4jkvag25/ I'm having the exact same code of a tutorial but still cannot get it to work and don't know why. My SCSS: html, body, #root { width:…
sir-haver
  • 3,096
  • 7
  • 41
  • 85
0
votes
1 answer

css preserve 3d with rotate animation not working anymore on latest browsers

on older versions of chrome(52),opera,firefox slide rotate animation was working with preserve 3d. Now in the latest versions of all browser this is not happening. Heres the live link for demo http://codeplay.co.in/expertise Here you can see the…
0
votes
1 answer

3D transform doesn't work on ie

I do some 3d transformation and on all browsers it works fine but on ie it doesn't work. If you have a time please see the example first in normal browser to see the transform after that on ie. On example you need to click on image. css. write with…
Aram Mkrtchyan
  • 2,690
  • 4
  • 31
  • 47