jquery - Transform-Style preserve-3d in internet explorer CSS not working -



jquery - Transform-Style preserve-3d in internet explorer CSS not working -

i got website working in opera chrome , firefox gets messed preserve-3d feature in net explorer.

is there way prepare net explorer css code , leave other browsers code right now?

i hope thats possible.

css:

.back img{ max-width: 90%; height: auto; margin: 1em; overflow: hidden; } .front{ margin-top: 0.2em; height: 100%; width: 100%; line-height: 1.2; margin-left: 0.2em; margin-right: 0.2em; } /*container flip*/ /* flip pane when clicked */ .flip .flipper, .flip-container.hover .flipper, .flip-container.flip .flipper { transform: rotatey(180deg); -ms-transform: rotatey(180deg); } /* flip speed goes here */ .flipper { transition: 0.8s; transform-style: preserve-3d; } /* hide of pane during swap */ .front, .back { backface-visibility: hidden; top: 0; left: 0; } /* front end pane, placed above */ .front { /* firefox 31 */ transform: rotatey(0deg); -webkit-transform: rotatey(0deg); position:absolute; margin-top: 1.2em; margin-bottom: 1.2em; margin-left: 20px; overflow: auto; word-break: normal; width: 90%; color: black; } /* back, hidden pane */ .back { transform: rotatey(180deg); }

html:

<div class="flip-container flip"> <div class="flipper"> <div class="back"> <img src="imgsource.png"> </div> <div class="front"> <p>some text</p> </div> </div> </div> <div class="flip-container flip"> <div class="flipper"> <div class="back"> <img src="imgsource.png"> </div> <div class="front"> <p>some text</p> </div> </div> </div> <div class="flip-container flip"> <div class="flipper"> <div class="back"> <img src="imgsource.png"> </div> <div class="front"> <p>some text</p> </div> </div> </div>

if click on .flip-container class .flip class gets removed , textbox show nice effect. doesnt work in net explorer.

thanks helping!

it aleksander bavdaz, provides reply , prepare here:

unfortunately ie uses non-prefixed properties, either can't utilize transform-3d @ or have define prefixed properties last.

css3 3d transform dont work on ie11

jquery html css

Comments

Popular posts from this blog

formatting - SAS SQL Datepart function returning odd values -

c++ - Apple Mach-O Linker Error(Duplicate Symbols For Architecture armv7) -

php - Yii 2: Unable to find a class into the extension 'yii2-admin' -