Permalink
Browse files

csstransform3d detect should prefer css conditionals - fixes Moderniz…

…r#1512

Use Modernizr detect for supports in transforms3d
  • Loading branch information...
jacobrossi committed Feb 5, 2015
1 parent 8aa80ae commit a54308e47e269a058472854b1ef417bd54f4e616
Showing with 11 additions and 6 deletions.
  1. +11 −6 feature-detects/css/transforms3d.js
@@ -9,7 +9,7 @@
]
}
!*/
define(['Modernizr', 'testAllProps', 'testStyles', 'docElement'], function( Modernizr, testAllProps, testStyles, docElement ) {
define(['Modernizr', 'testAllProps', 'testStyles', 'docElement', 'test/css/supports'], function( Modernizr, testAllProps, testStyles, docElement ) {
Modernizr.addTest('csstransforms3d', function() {
var ret = !!testAllProps('perspective', '1px', true);
var usePrefix = Modernizr._config.usePrefixes;
@@ -19,12 +19,17 @@ define(['Modernizr', 'testAllProps', 'testStyles', 'docElement'], function( Mode
// some conditions. As a result, Webkit typically recognizes the syntax but
// will sometimes throw a false positive, thus we must do a more thorough check:
if ( ret && (!usePrefix || 'webkitPerspective' in docElement.style )) {

// Webkit allows this media query to succeed only if the feature is enabled.
// `@media (transform-3d),(-webkit-transform-3d){ ... }`
var mq;
// Use CSS Conditional Rules if available
if (Modernizr.supports) {
mq = '@supports (perspective: 1px)';
} else {
// Otherwise, Webkit allows this media query to succeed only if the feature is enabled.
// `@media (transform-3d),(-webkit-transform-3d){ ... }`
mq = '@media (transform-3d)';
if (usePrefix ) mq += ',(-webkit-transform-3d)';
}
// If loaded inside the body tag and the test element inherits any padding, margin or borders it will fail #740
var mq = '@media (transform-3d)';
if (usePrefix ) mq += ',(-webkit-transform-3d)';
mq += '{#modernizr{left:9px;position:absolute;height:5px;margin:0;padding:0;border:0}}';

testStyles(mq, function( elem ) {

0 comments on commit a54308e

Please sign in to comment.