【问题标题】:Checking the support for a css property attribute检查对 CSS 属性的支持
【发布时间】:2012-04-18 22:20:39
【问题描述】:

我想测试浏览器是否支持特定的 css 属性。对于 css 属性,我可以这样做

document.createElement("detect").style["-webkit-overflow-scrolling"] === ""

但是如果我必须检查特定的类或属性怎么办。例如,我想测试对

的支持
position:fixed

我该怎么做(除了使用 Modernizr)?请帮忙。

【问题讨论】:

    标签: javascript jquery css cross-browser


    【解决方案1】:
    function isFixedSupported() {
      var isSupported = null;
      if (document.createElement) {
          var el = document.createElement("div");
          if (el && el.style) {
              el.style.position = "fixed";
              el.style.top = "10px";
              var root = document.body;
              if (root && root.appendChild && root.removeChild) {
                  root.appendChild(el);
                  isSupported = el.offsetTop === 10;
                  root.removeChild(el);
              }
          }
      }
      return isSupported;
    }
    
    var canUseFixed = isFixedSupported(); //true:false
    

    FIDDLE

    【讨论】:

    • 我已经用了很长时间了,不记得我第一次得到它的确切位置,但我不认为它在那里,可能是其他一百个有这个的网站之一功能,就像在这里经过一番搜索后:Stack Overflow。如果它起源于 Kangax,我不知道,大概?
    • 还有另一个版本here,Google 搜索提供了 1600 万条类似功能的结果。
    • 不,在 chrome 中为我返回 <body> 吗? FIDDLE
    • 是的,我在身体里没有任何东西之前检查过它:|如果我在体内放一些东西并运行它,效果很好。 :)
    猜你喜欢
    • 1970-01-01
    • 2010-11-23
    • 1970-01-01
    • 2012-11-04
    • 2023-03-31
    • 2019-04-21
    • 2011-08-07
    • 2011-08-11
    • 2019-01-29
    相关资源
    最近更新 更多