how to detect HTML5 and CSS3 support in IE browser?

Question

currently I am working on project where I have to detect does clients browser supports HTML5 or not, I am using following script to detect HTML5 support it works fine in all browsers except IE.

   function getHTML5VideoSupport() {
    if (!IsAttributeSupported("video", "src")) {
        return false;
    }

    else {
        return true;
    }
}

this method returns true if browser supports HTML5 else false. but problem is in IE, and I also have to check for CSS3 support.

Where's the code for IsAttributeSupported()? Are you only trying to detect HTML5 video support? — jfriend00
– jfriend00, Commented Dec 28, 2011 at 7:24

jfriend00 · Accepted Answer · 2011-12-28 07:29:45Z

6

Neither HTML5 nor CSS3 is an all or nothing proposition. You can't say a browser 100% supports it or doesn't support it as both are a whole grab bag of individual capabilities.

The safe way to check for support is to identify the particular features that you need and use feature detection to see if they are supported or not.

For example, IE9 supports pieces of CSS3, but not CSS transitions. HTML5 consists of many different pieces which are again supported differently by different browsers and different versions of the same browser. There's one set of tests for HTML5 audio, yet another for local storage, canvas, hash change events, web sockets, etc...

The feature detection library modernizr contains a wide array of feature detection capabilities that can let you test for exactly the capabilities your app needs using well-tested code. You can either include the whole library or copy just the pieces you need into your own app.

So, to test for CSS3, you'd have to identify exactly which capabilities you need in CSS3 and identify feature tests for those particular capabilities.

See this article for more info about feature detection for individual HTML5 features.

edited Dec 28, 2011 at 7:29

answered Dec 28, 2011 at 7:13

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Sameer Over a year ago

thanks for your kind reply but my question is how I detect clients browser does supports HTML5 or not my above given script does not works on IE

jfriend00 Over a year ago

@Sameer - You don't seem to understand. There is no single test that detects HTML5 or not. HTML5 is a collection of hundreds of features - some of which may be supported and some of which may not in any given browser. Which exact feature are you interested in testing for? Only HTML5 video?

jfriend00 Over a year ago

@Sameer - added reference to this article about detecting individual HTML5 features.

Sameer Over a year ago

Jfriend00 thank you for sharing your kind experience, now i am using border radius property of css3 and html5 video and Audio tags of HTML5 for testing HTML5 support.

Collectives™ on Stack Overflow

how to detect HTML5 and CSS3 support in IE browser?

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related