Is there a generic way in javascript to check if the css property is supported by current browser or not?
I am currently using "document.compatMode" to check if it is quirks or not. But there must be a way to check specific to a property.
1
-
possible duplicate of check browser css property supportavpaderno– avpaderno2013-06-21 16:51:48 +00:00Commented Jun 21, 2013 at 16:51
Add a comment
|
3 Answers
You can do this, ex:
typeof document.body.style.borderRadius
In supported browsers, it should return 'string'. In non supported, it will be 'undefined'
1 Comment
emphaticsunshine
Thanks, it works. Anyways do you know a way to find pseudo class is also supported or not? I meant by ':hover',':active'.
There is a new DOM API CSS.supports for that purpose. FF, Opera (as supportsCSS) and Chrome Canary already implement this method.
For cross-browser compatibility you can use my CSS.supports polyfill
Example:
CSS.supports("display", "table");//IE<8 return false
But, you still need to specify browser prefix for prefixing css properties. For example:
CSS.supports("-webkit-filter", "blur(10px)");
I suggest to using Modernizr for feature-detection.
1 Comment
emphaticsunshine
Thank you for your suggestion. I am familiar with Modernizr but didn't want to include a js lib for 1 single detection.
No.
There's not.
answered Jan 11, 2012 at 18:24
Lightness Races in Orbit
387k77 gold badges670 silver badges1.1k bronze badges
1 Comment
emphaticsunshine
There is never "no" for a problem.