Modernizer功能檢測

我必須使用modernizer來檢測瀏覽器是否支持「cssscrollbar」屬性，true或false。基於這個價值，我必須做一些東西，比如添加插件和CSS。Modernizer功能檢測

我使用這樣的事情下文，這我不知道的：

var frag = document.createDocumentFragment(); 
for (prop in Modernizr) { 
    var para = document.createElement('p'); 
    para.textContent = prop + ': ' + Modernizr[ prop ]; 
    frag.appendChild(para); 
} 

document.body.appendChild(frag);

檢查，我這裏指的是fiddle。

來源

2013-03-22 mandava

那麼，有什麼問題嗎？ – 2013-03-22 07:27:14

我使用的是2.6.2，它沒有得到對cssscrollbar的支持，所以我想爲插件添加一個滾動條測試....我是modernizer的新手。 – mandava 2013-03-22 07:28:49

所以你想知道如何測試該功能或如何將測試集成到Modernizr中？ – 2013-03-22 07:33:52

Modernizr.addTest('cssscrollbar', function() { 

     // Tested Element 
    var test = document.createElement('div'), 

     // Fake body 
     fake = false, 
     root = document.body || (function() { 
      fake = true; 
      return document.documentElement.appendChild(document.createElement('body')); 
     }()), 

     property = 'scrollbar{width:0px;}'; 

    // Force scrollbar 
    test.id = '__sb'; 
    test.style.overflow = 'scroll'; 
    test.style.width = '40px'; 

    // Apply scrollbar style for all vendors 
    test.innerHTML = '&shy;<style>#'+Modernizr._prefixes.join(property+' #__sb::').split('#').slice(1).join('#')+property+'</style>'; 

    root.appendChild(test); 

    // If css scrollbar is supported, than the scrollWidth should not be impacted 
    var ret = test.scrollWidth == 40; 

    // Cleaning 
    document.body.removeChild(test); 
    if (fake) { 
     document.documentElement.removeChild(root); 
    } 
    return ret; 
});

如果u添加此則u將會對近代化cssscrollbar支持..................

來源

2013-03-22 07:44:19 mandava

還有的testProp()功能：

Modernizr.testProp('css-scrollbar');

或者你可以customize your Modernizr（在打開的「非核心檢測」）：

來源

2013-03-22 07:54:51

Modernizer功能檢測

回答

相關問題