Question

我试图使用Modernizr.prefixed（）函数来避免在我的JS中编写所有供应商代码，但它似乎不起作用。我想用它来做css过滤器，这是我的代码： Modernizr.prefixed('filter') // returns 'filter' on Chrome which actually needs '-webkit-filter'

我已经查看了Modernizr的源代码，但它没有帮助（https://github.com/Modernizr/Modernizr/blob/master/feature-detects/css/filters.js）。

请注意，过滤器的功能检测存在于我的Modernizr构建中。

谢谢！

Answer 1

不幸的是，this is really a chromium bug。

优秀的年轻绅士斯图克斯为这个具体案例提供了解决方法，但

// This could be written more efficiently, but shows the technique at least
function getFilterPrefixed () {
    var elem = document.createElement('div');
    var testValue = 'grayscale(1)';
    var prop;
    var i;

// `Modernizr._prefixes` is a list of known (common) vendor prefixes
for (i = 0; i < Modernizr._prefixes.length; i++) {
    prop = Modernizr._prefixes[i] + 'filter';

    // Set-and-check: if the property holds a valid value, it's the one
    elem.style[prop] = testValue;
    if (elem.style[prop] == testValue) {
        return prop;
    }
  }
}

使用Modernizr获取css过滤器的前缀

1 个答案: