Проверить поддержку CSS CSS с помощью JavaScript?

Возможно ли в JavaScript знать, поддерживается ли свойство CSS браузером клиента? Я говорю о свойствах вращения CSS3. Я хочу выполнить некоторые функции только в том случае, если браузер поддерживает их.

Ответ 1

Я считаю, что вы можете сделать это следующим образом:

if ('WebkitTransform' in document.body.style 
 || 'MozTransform' in document.body.style 
 || 'OTransform' in document.body.style 
 || 'transform' in document.body.style) 
{
    alert('I can Rotate!');
}

Ответ 2

Для этой цели существует новый API DOM CSS.supports. FF, Opera (as supportsCSS) и Chrome Canary уже реализуют этот метод.

Для кросс-браузерной совместимости вы можете использовать CSS.supports polyfill

Пример:

CSS.supports("display", "table");//IE<8 return false

Но вам все равно нужно указать префикс браузера для префикса свойств css. Например:

CSS.supports("-webkit-filter", "blur(10px)");

Я предлагаю использовать Modernizr для обнаружения функций.

Ответ 3

Вы можете использовать Modernizr библиотеку.

Пример для преобразования css:

в .css файле;

.no-csstransforms .box { color: red; }
.csstransforms .box { color: green; }

в .js файле;

if (Modernizr.csstransforms) {
  // supported
} else {
  // not-supported
}

Ответ 4

Можно попробовать?

var temp = document.createElement('div');
var isSupport = temp.style['propName'] != undefined;