CODEWITHSUNDEEP
csswebkitmodernizr
jigglyT101
jigglyT101

Reputation: 984

Detecting for -webkit-apperance with Modernizr

Can anyone tell me how to detect -webkit-appearance, moz-apperance, or appearance using Modernizr?

I have custom selects, and checkboxes that use these and I need to ensure the additional styles are not applied on those browser that dont support these properties.

Thanks

Upvotes: 0

Views: 2867

Answers (2)

vieron
vieron

Reputation: 991

Just use Modernizr.testProp() method:

Modernizr.testProp('webkitAppearance');

And with this check you can write your own Modernizr test using Modernizr.addTest():

Modernizr.addTest('webkit-appearance', function() {
    return Modernizr.testProp('webkitAppearance');
});

Upvotes: 4

Spudley
Spudley

Reputation: 168695

I'm pretty certain that Modernizr doesn't include a detection routine for this feature yet -- it's just too new.

However, as it's a CSS property, you should be able to detect it fairly simply for yourself without needing to invoke modernizr.

This page details how to do a quick check to detect if a CSS property is available.

Simply check whether the property exists in the style property of any given DOM element. If the property is supported, it will be in the DOM, even if it isn't actually set to anything.

Hope that helps.

Upvotes: 1

Related Questions