Cross-fade between two images on page load then stop

On开发者_开发技巧ce the page has finished loading, I would like one image to cross-fade to another. Not in a loop, just once.

The effect I would like to create can be seen here:

Blur Fade

I am sure it must be quite simple using jQuery?

Thanks in advance

---

You can crossfade between two images by positioning them in the same place using CSS, then calling fadeIn() and fadeOut() using jQuery.

For example:

$(function() {
    $('img.OldImage').fadeOut();
    $('img.NewImage').fadeIn();
});

---

Try this:

$(document).ready(function(){
    $(function() {
        $('.byeIMG').fadeOut("slow");
        $('.heyIMG').fadeIn("slow");
    });
});