javascript - Windows XP 上的 Chrome 中不显示 3D 变换

Question

我有一个包含一系列多维数据集的页面。这些立方体使用 CSS 进行 3D 转换。

它们在 Windows 7 的 Chrome 中显示良好，但在 Windows XP 的 Chrome 中我看到的只是白色背景。两者都运行最新版本的 Chrome。

View the full page on jsfiddle

<div class="cube" style="-webkit-transform: translateZ(-32.5px);">
    <div class="front" style="-webkit-transform: translateZ(32.5px);">
        <img src="search.png" width="65" height="65">
    </div>
    <div class="back" style="-webkit-transform: rotateX(-180deg) translateZ(32.5px);">
        <img src="search.png" width="65" height="65">
    </div>
    <div class="right" style="-webkit-transform: rotateY(90deg) translateZ(32.5px);">               
        <img src="/search.png" width="65" height="65">
    </div>
    <div class="left" style="-webkit-transform: rotateY(-90deg) translateZ(32.5px);">
        <img src="search.png" width="65" height="65">
    </div>
    <div class="top" style="-webkit-transform: rotateX(90deg) translateZ(32.5px);">
        <img src="search.png" width="65" height="65">
    </div>
    <div class="bottom" style="-webkit-transform: rotateX(-90deg) translateZ(32.5px);">
        <img src="search.png" width="65" height="65">
    </div>
</div>

Answer 1

只有启用了 GPU 加速，Chrome 才会正确渲染 3D CSS。如果您在 safari for windows 上测试相同的代码，它应该可以工作。

要查看您的 chrome 是否启用了 GPU 加速，请在地址栏中输入 about:GPU 并查看它的内容。

http://www.chromium.org/developers/design-documents/gpu-accelerated-compositing-in-chrome