Update: Hardware accelerated alternative to jQuery animate() top, left, width, height and opacity CSS properties for iPhone/iPad

Update to my post here – I’ve tweaked the script to use CSS3 transitions on Firefox 4+ and Opera 10.50+ as well as modern webkit based browsers such as Chrome and Safari.

The CSS3 transforms and transitions enhanced carousel can be found here:
freestyle-developments.co.uk/demo/public/portsurf/?css3

…and the normal carousel:
freestyle-developments.co.uk/demo/public/portsurf/

Source code for CSS3 transforms and transitions enhanced carousel

N.B. The normal carousel works in IE7 and IE9 beta, but not in IE8 (it seems IE8 can’t figure out the dimensions of DOM elements properly).

MooTools Depender, Safari, etags and 412 Precondition Failed

/**
* This replaces the default MooTools more Depender.request function to use
* HTTP "get" rather than "post".
*
* When sending requests for files via the depender, I was finding that Safari
* wasn't getting and re-evaluating them the second time I visited the page.
* This was because an etag was sent with each script.
*
* Safari responds to etags properly and adds "If-None-Match" and
* "If-Modified-Since" headers to another request for the same file. This makes
* Apache respond with a 412 status (Precondition Failed) as it should do for
* "post" requests (according to RFC 2616).
*
* Unfortunately Safari doesn't then deal with the 412 as it does with a 304
* (Not Modified). It doesn't grab what it has in the cache and put it in the
* response, it gives you nothing.
*
* For "get" requests, Apache has to respond with a 304, or 200 or whatever, but
* not 412. So we change the request method so we don't have to deal with 412.
*/
Depender.request = function(url, callback){
    new Request.JSON({
        url: url,
        secure: false,
        onSuccess: callback,
        method:'get'
    }).send();
};