CSS3卡翻转动画，检测是否不支持

CSS3 card flip animation, detect if not supported

本文关键字：检测是否不支持动画翻转 CSS3 更新时间：2023-09-26

我在我的项目中使用三维卡片翻转动画。如本网站所示（http://css3.bradshawenterprises.com/flip/）

我想检测浏览器何时支持这种动画。例如，如果你有windowsxp/旧驱动程序，Chrome可能不会默认支持它，因为它会导致崩溃。当Chrome不支持它时，它会显示镜像的名称，动画不会是3d的（对我来说）。

我检查了两种不同的检测方法：
如何在没有webkit上下文的情况下检测CSS translate3d？来自
正在检测'；变换：translate3d'；支持
var has3d=函数（）{return（窗口中的"WebKitCSSMatrix"和新WebKitCSSMatrix（）中的"m11"）；}

两者都给了我一个真实的价值。什么是不受支持的，以及在不使用像Modernizr这样的库的情况下如何检测该属性。

您应该使用一些Modernizr来检测用户的浏览器是否支持您进行卡片翻转所需的一切。它正是为了这个目的而创建的，并且比您必须找到和维护自己的解决方案时更有效地完成工作。随着浏览器的发展，modernizr也会，您不必担心您的功能检测是否会破坏

您是否被迫使用CSS3？

Flip兼容所有主流浏览器。。。