隱藏邊框的box-shadow支持

我有邊框的股利和一箱陰影：隱藏邊框的box-shadow支持

div.my-div 
{ 
    border: 1px solid #555; 
    box-shadow: 0px 4px 35px rgba(0,0,0,0.5); 
}

邊界是醜陋的，但它是必要不支持影子瀏覽器（div的背景是與周圍元素顏色相同）。

如何檢測瀏覽器是否支持盒子陰影並刪除盒子陰影？也許用JavaScript？

編輯：我想這樣做沒有任何依賴性（如modernizr）。

例如：

var boxShadowSupported = ???; 
if (boxShadowSupported && typeof(document.getElementsByClassName) != 'undefined') { 
    var elements = document.getElementsByClassName('my-div'); 
    for (var i= 0; i < elements.length; i++) { 
    elements[i].setAttribute('style', 'border: 0;'); 
    } 
}

來源

2012-07-20 Abhi Beckert

使用http：//的Modernizr .com/ – SVS 2012-07-20 08:27:20

我寧願有一個醜陋的邊框，而不是將數千行javascript添加到我的頁面。 – 2012-07-20 08:31:24

怎麼樣：2401b〜2.4kb http://modernizr.com/download/#-boxshadow-teststyles-testprop-testallprops-domprefixes – andlrc 2012-07-20 08:34:15

您可以複選框，shaddow瀏覽器支持JavaScript的：

if ('boxShadow' in document.body.style) 
{ 
    alert('I can support shadow!'); 
}

來源

2012-07-20 08:42:09 Alireza41

也許你可以試試這個：

var foo=document.createElement("div"); 
foo.style.boxShadow="0px 0px 0px rgb(0,0,0)"; 
document.body.appendChild(foo); 
var boxShadowSupported=foo.style.boxShadow?1:0;

來源

2012-07-20 08:43:53 Mageek

隱藏邊框的box-shadow支持

回答

相關問題