围绕 Y 轴的 CSS 3D 旋转导致 Chrome 中旋转的内容闪烁

标签 css google-chrome rotation

我在 Chrome 中遇到了旋转内容的问题,其样式为 -webkit-transform: rotateY( 180deg )。

如果内容有白色背景颜色,它会闪烁,但如果它有背景颜色:透明,旋转过程中闪烁会消失。这可能是我尝试处理的一个错误,但有时这种方式不会导致任何结果。

有什么合适的方法可以解决这个问题吗?

最佳答案

情况是这样的card flip但我有更复杂的卡片标记。在这里,对于背面的卡号 2,样式为 -webkit-transform: rotateY(180deg) 而对于其他卡,样式为空。对于卡号 1,我写了 -webkit-transform: rotateY(0deg) what removed blining during the css rotation -webkit-transition: -webkit-transform 1s 。

关于围绕 Y 轴的 CSS 3D 旋转导致 Chrome 中旋转的内容闪烁,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18723246/

相关文章:

css - 如何将显示为左浮动的几个div居中

jquery - 如果存在很多选项卡,导航选项卡会使用省略号调整宽度

javascript - JQuery BlockUI 鼠标加载光标不会在 Google Chrome 中恢复为默认值

google-chrome - 对于某些文件,通过 NPAPI 浏览器的 Office 授权插件在 Chrome 中打开 webdav 文件失败

rotation - 在hammer.js 错误上旋转

Jquery 动画旋转不起作用

android - 旋转图像文件而不更改文件大小

android - React Native Android WebView 如何禁用水平滚动?

html - 使父 div webkit-filter 不影响 child

google-chrome - Service Worker 不提示注册 - net::ERR_FILE_EXISTS