October 28, 2007 No comments
  • No Tags

XUL-Enhanced Web Apps

This article presents a little-known use of XUL (Mozilla’s user-interface language) and shows how to take advantage of its superior performance and accessibility over HTML while maintaining cross-browser compatibility. I will illustrate this using a proof-of-concept JavaScript library that can render UI widgets using either XUL or DHTML.

If possible, you will want to open this page in Firefox. The side-by-side examples below will not make much sense otherwise.

Side-by-Side Tabbed Panel Example

  • On the left we have a (very) basic DHTML implementation of tabbed panels.
  • On the right, provided you are using Firefox, you will see the same panel rendered with XUL.
  • In any other browser, the second panel degrades to the DHTML implementation and therefore looks identical to the one on the left.
DHTML Tabbed Panel XUL Tabbed Panel

 

 

First TabSecond TabThird Tab

 

First tab content

First tab content

Second tab content

Third tab content

You may Leave a comment or Subscribe to Comments RSS or Trackback this entry.

Leave a comment

Please be polite and on topic. Your e-mail will never be published.