loading gif before while image loads, then image fades in

Here's the jsfiddle I've been messing around with: http://jsfiddle.net/Hrs2a/

Basically, I'm trying to get the loading image to come up wh开发者_如何学编程ile the image is loading and then have the image fade in when it's fully loaded.

I tried to follow the tutorial here but couldn't get it to work. What am I doing wrong?

How is this supposed to work, when the img never gets into the DOM?

EDIT:

Look at this fiddle I made: http://jsfiddle.net/9VmWA/ I think it does what you want.