2. Before before showing the next image, load some dummy image (say 1px x 1px, color like the background-color; I just used the first image in the lot - happened to work in most cases). Safari won't flicker, others do (hence 1.).

If the newImage width and height properties are set before the newImage is called, then the image being replaced will immediately become coerced (distorted) to the new dimensions until the newImage has finished downloading. This is a bigger issue for users viewing large images or with slow dialup connections.

One of the comments showed setting newImage.style width and height properties, while I am setting the object properties. There may be a difference in the two methods. I have the luxury of knowing the newImage dimensions, so it is easy to set these properties.

This method is working well for me on Safari 1.3 and 2.0, Firefox 1.0, Mozilla 1.7.3, and IE6, browsers I currently have access to. (Sorry no URLs.)

A workaround is to attach an onLoad() handler to the IMG element that runs the following code:
if (navigator.userAgent.indexOf('Safari')!=-1) {
var elt = document.getElementById("MYIMAGE");
elt.style.height = (elt.height - 1) + "px";
elt.style.height = (elt.height) + "px";
}
Tickling its height a little bit is enough to make the image fold back inside its intrinsic dimensions.