fade out one image, fade in second

I want one image to slowly fade开发者_如何学运维 out, while the second image slowly fades in. Both images should be at the same position ofcourse. How can I achieve this without setting their styles to position: absolute?

try something like...

$('imageOneSelector').fadeOut(1000, function(){
   $(this).replaceWith(new image html);
   $('imageOneSelector').fadeIn(1000);
});

UPDATE:

heres a jsfiddle test without the images but should be the same concept...

http://jsfiddle.net/qWngq/1/