javascript – 在浏览器中测试对overflow-y：auto的支持

溢出属性支持

overflow-y自CSS2.1次以来一直存在(但它最近已被标准化,in the css3 spec).因此,support on desktop browsers非常体面.

现在,你在这里问的是当我们指定overflow-y时滚动行为是否真的有效：滚动特定元素.

最近在移动浏览器中引入了此行为.更准确地说,Apple在iOS 5中引入了-webkit供应商前缀(参见0700页的第176页).

我找不到Android的具体信息.

我可以说支持溢出滚动(供应商前缀或非前缀)：

>最新的nexus7(Android 4.1.1)：是的
> Android 2.3.x：没有
> iOS> = 5：是的
> iOS< 5：不
滚动溢出的特征检测

如果要为元素提供滚动行为,我建议使用特征检测.

这是a gist,显示了如何检测这个滚动溢出属性(它是integrated in Modernizr since).如果您不想使用Modernizr,这里有一个更简单的版本,几乎完全相同：

/**
 * Test to see if overflow-scrolling is enabled.
 */

var hasCSSProperty = function(prop) {
    if (window.getComputedStyle) {
        return window.getComputedStyle(document.body, null)[prop];
    } else {
        return document.body.currentStyle[prop];
    }
};

var supportOverflowScrolling = function() {
    if (hasCSSProperty('overflow-scrolling') ||
        hasCSSProperty('-webkit-overflow-scrolling') ||
        hasCSSProperty('-moz-overflow-scrolling') ||
        hasCSSProperty('-o-overflow-scrolling')) {
        return true;
    } else {
        return false
    }
};