I recently built a small web application and the client requested, after a significant portion was built, that it be placed in different tabs. I immediately thought of the Yahoo! User Interface Library, which is a set of independent components “for building interactive web applications.”
I just wanted the TabView component, which is easy to just drop in and has pretty good documentation. This component is new in the 0.12 version of the YUI library.
However, FireFox 1.5 had an issue with the pages once the component was added. The different tabs would show up, but the bodies were all visible at the same time. IE6 did not have that issue, bizarrely enough. I asked some questions on the mailing list and received some helpful answers–the main things I needed to do were add the component instantiation function to the onload method of the window, and make my HTML valid. I used the W3C validator for the latter.
This post is pretty short, and I guess that’s the point–adding tabs to an existing application was pretty easy using the Yahoo! libraries.
Using the YUI library was simple and the support and documentation were good. I don’t like to think of how long it would have taken me to write a tab interface supported on so many browsers. If you need to retrofit some UI magic onto an existing application, or you just want discrete components for your web application (as opposed to the all in one approach of GWT), YUI is well worth a look.