Using details and summary tags in Firefox and Internet Explorer
Posted in .../weblog on 2013-01-16 22:29:52Last month, the World Wide Web Consortium (W3C) declared HTML5 is officially "feature complete." I decided it was finally time to make the switch from HTML4.01. While reading about all the new tags, I was excited about some tags and confused about the usefulness of others (like repurposing the previously deprecated <u> for "misspelt words"). I quickly dove in to compatibility charts and performed some of my own testing. One of my greater disappointments was the lack of browser support for the <details> tag.
I set out to find a work around that would enable proper functioning of details and summary, that is, to enable it's open/close interactivity. What I found was an effective solution in jquery-details by Mathias Bynens. Unfortunately, this solution depends on another library: jQuery. jQuery is an excellent library which I use in some of my projects, but not all. Since some of my projects do not use jQuery, it seemed unnecessary to include a library as comprehensive as jQuery for the benefit of one simple work-around. So I wrote my own.