Over a million developers have joined DZone.

For your post-Christmas hangover, another CanIUse Mashup

· Web Dev Zone

Easily build powerful user management, authentication, and authorization into your web and mobile applications. Download this Forrester report on the new landscape of Customer Identity and Access Management, brought to you in partnership with Stormpath.

This will be short and quick as I've got to hit level 24 on Guild Wars 2. A while back I posted a few demos that made use of CanIUse.com data. These demos were kinda nice I think, although not the most prettiest examples of what you could do with CSS. Based on a suggestion from one of the commenters I created something a bit simpler and more direct.

Based on selecting a set of features, this new demo will tell you the minimum version of each major browser required to support those features.

So for example, if form field validation requires IE10 and canvas requires IE9 (I'm not going to rant about this again I'm not going to rant about this again) then the minimum version of IE you can use for both those features is IE10.

Here's a screenshot of this in action. As a reminder, CanIUse.com supports multiple browsers. The ones you see here were simply my list of what I thought was critical enough to include in the UI.

Ok, check it out, and let me know what you think.

Edit: Based on a recommendation by Jesse Freeman, I finally got around to adding 'bookmarkability' to the demo. Check this version: http://raymondcamden.com/demos/2012/dec/20/test4.html. As you select options, the URL will change. You can then bookmark and load up that version, or share the URL with others.



The Web Dev Zone is brought to you by Stormpath—offering a complete, pre-built User Management API for building web and mobile applications, and APIs. Download our new whitepaper: "Build Versus Buy: Customer Identity Management for Web and Mobile Applications".

Topics:

Published at DZone with permission of Raymond Camden , DZone MVB .

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}