Sunday, July 06, 2008

A bit of fun and Google's Ajax library hosting.

About a year ago, I revamped my main static site, clearing stuff that duplicated blogging type content into blogs, and changing the navigation to use accordion folds. That was using Prototype for a basis and Rico for the accordion (I looked at Dojo, but I didn't care for their use of custom attributes which baked a lot of behaviour into the HTML as well as making it fail validation).

After Google announced that they were hosting the main Ajax libraries, I had been meaning to move from having local copies of Prototype. And then I saw two articles in quick succession, only on A List Apart, about binding vs closures, which made me waver towards jQuery on purism grounds, and then via Christopher Steen's link blog, an introduction to jQuery UI - which showed that jQuery accordions require a lot less structural markup and hand-rolled class assignments even than Rico's. So I've made the change, and was delighted to find that, not only was the deadweight on pages was reduced, but I could just add mouseover unfolding as well.

There is a jQuery rounded corners plug-in out there, but I've not managed to get it to work in conjunction with a definition-list based accordion, so for the moment, I'm cheating with -moz-border-radius and leaving it at that.

One word of warning for people serving XHTML as application/xhtml+xml, though. In Google's shortcut

<script src="..."></script>
<script>
  // Load jQuery
  google.load("jquery", "1");
…

where the src is http://www.google.com/jsapi, the loading is done by injecting a script element via document.write(), so fails utterly -- I had to fall back to directly loading from a fixed URL, in this case, http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js for the current jQuery release.

No comments :