Menu
I've seen plenty of examples for detecting support for border radius using something like:
var cssAttributeNames = ['BorderRadius', 'MozBorderRadius', 'WebkitBorderRadius', 'OBorderRadius', 'KhtmlBorderRadius'];
for (var i = 0; i < cssAttributeNames.length; i++) {
var attributeName = cssAttributeNames[i];
if (window.document.body.style[attributeName] !== undefined) {
this._useCss = true;
break;
}
}
But this doesn't seem to work for IE9, which does support border-radius. Am I missing something?
948
The concept of feature detection The idea behind feature detection is that you can run a test to determine whether a feature is supported in the current browser, and then conditionally run code to provide an acceptable experience both in browsers that do support the feature, and browsers that don't.
Another good approach is to encapsulate feature detection into a set of functions that can then be used throughout the code. Here's a best practice for detecting whether the browser supports the HTML5 <canvas> element and if so, makes sure that the canvas. getContext('2d') method is working as well.
Got it - the detection array needs 'borderRadius' added - it's case-sensitive.
142
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
