JQuery :: Best Practice For Fading-in An Image ?

I have a photo blog [url] and want to create an effect that fades-in the displayed picture when the page is loaded.

An important requirement for me would be that the page also has to work without Javascript.

Currently I am using the following small plugin:

It is called directly beneath the <img> element:

This way it works fine with the current versions of Firefox and IE. I did not test other browsers or versions yet. I tried to call it in $(document).ready but then IE might display the picture shortly before it is hidden and faded-in.

Since I am not 100% happy with having the code in the middle of the HTML and with depending on the timing of execution to avoid flickering I wanted to ask for other solution or best practices to achieve what I would like to do.

One solution that came to my mind is to do create the image in JScript and only fade it in after it is loaded. To work without Javascript I could still put the <img> element where it was but within a <noscript> element. But not sure how well the <noscript> is supported by older or exotic browsers.