CSS3翻转在Internet Explorer中不起作用

点击按钮时，我有一个div翻转，以显示另一个div。CSS3翻转在Internet Explorer中不起作用

<div class="flip-container"> 
    <div class="flipper"> 
     <div class="front"><h1>FRONT</h1></div> 
     <div class="back"><h1>BACK</h1></div> 
    </div> 
</div> 

<button class="flipper-btn">Flip it!</button>

这是工作在铬漂亮，但（当然）不是在IE浏览器。它只是显示.front div的背面，而不是.back div。我搜寻了一个答案，发现其他一些人也遇到了同样的问题，但是我一直无法工作。

http://jsfiddle.net/0sypya5h/3/

希望有人能帮助... ...

来源

2014-12-04 user2969934

'在IE9 + HTTP transform'工作：// caniuse。 com /＃search = CSS3％20Transforms – 2014-12-04 19:57:51

什么是您的IE版本？ – 2014-12-04 19:58:59

IE11 .......... – user2969934 2014-12-04 20:02:56

这里的问题是在Internet Explorer 11的lack of support for preserve-3d我们http://remote.modern.ie最近推出的支持（支持在Android，OS X，iOS版时，Windows，和Windows Phone）。

您可以预计这将在即将到来的稳定版本中着陆。直到本机支持船舶您可能会发现更多的成功既动画元素的独立，而不是试图所以，在复利的方式：

.flipped .front { 
    transform: rotateY(180deg); 
} 

.flipped .back { 
    z-index: 1; 
    transform: rotateY(0deg); 
}

小提琴：http://jsfiddle.net/jonathansampson/wv3rymoe/

来源

2014-12-04 20:06:32 Sampson

你的小提琴在ie 11中不起作用 – 2017-06-30 04:39:43

@ClaudiuCreanga尝试'-ms-transform'而不是'transform'。 – Sampson 2017-07-21 19:09:06

无法正常工作。从我所知道的 - 变形再也不存在了。它在IE的某些版本中得到了支持，但在ie11的最新版本中被删除，目前还没有最新版本，即浏览器支持它。 – 2017-07-22 08:56:00

CSS3翻转在Internet Explorer中不起作用

回答

相关问题