根据 caniuse.com 的说法,Android 应该从 3.0 版开始完全支持 css 3d 转换。当我运行以下测试之一(例如在 Android 4.1、Samsng Galaxy 上)时,它们返回 true。但是,当我查看使用 3d 转换和 preserve-3d 的页面时,它不起作用。例如:
http://jsfiddle.net/bartaz/e3Rjz/show/
测试1:
(function(Modernizr, win){
Modernizr.addTest('csstransformspreserve3d', function () {
var prop = Modernizr.prefixed('transformStyle');
var val = 'preserve-3d';
var computedStyle;
if(!prop) return false;
prop = prop.replace(/([A-Z])/g, function(str,m1){ return '-' + m1.toLowerCase(); }).replace(/^ms-/,'-ms-');
Modernizr.testStyles('#modernizr{' + prop + ':' + val + ';}', function (el, rule) {
computedStyle = win.getComputedStyle ? getComputedStyle(el, null).getPropertyValue(prop) : '';
});
return (computedStyle === val);
});
}(Modernizr, window));
测试 2:
Modernizr.addTest('csstransformspreserve3d', function () {
var prop,
val,
cssText,
ret;
prop = 'transform-style';
if ('webkitTransformStyle' in document.documentElement.style) {
prop = '-webkit-' + prop;
}
val = 'preserve-3d';
cssText = '#modernizr { ' + prop + ': ' + val + '; }';
Modernizr.testStyles(cssText, function (el, rule) {
ret = window.getComputedStyle ? getComputedStyle(el, null).getPropertyValue(prop) : '';
});
return (ret === val);
});
现在我不知道问题是什么。测试不起作用吗?Android 4.1 不支持“preserve-3d”吗?还是有其他问题?