Strange things happen during the holidays. Maybe it’s because I am more relaxed and less busy, but it seems that each time, a crazy idea about some web technology will cross my mind and I’ll end up spending hours exploring it.
A couple days later, I had this working: tabbed panel example.
If you are not using the Firefox browser, you will not see anything interesting, so here’s a screenshot of the second panel, viewed in Firefox (XUL powered).
You can check out the source code if you want to see how it’s done.
Update: As whoughton pointed out, it doesn’t degrades to DHTML as it should in Safari. I will fix that soon, it’s probably not a serious bug.
Update 2: The problem in Safari is caused by its user-agent. To detect whether I should render with XUL or DHTML, I look at the user-agent string. If it contains the word “gecko”, I assume the browser uses the Gecko rendering engine and therefore supports XUL… Well it turns out Safari’s user-agent string includes “Gecko” even though it’s not based on Gecko at all. Weird. Anyway, I’ll just have to fix the detection code.
Update 3. It’s fixed in Safari, thanks to Boris tips.