How to fade in a div while another div is fading out?

Question

Here's my demo - http://jsfiddle.net/VHm4B/1/

So I want one item to fadeIn while another item is being faded out. My current demo still fades out one item and then fades the other in. Is there a way for both these actions to happen in sync?

I have already looked at the cycle plugin but it seems more for slideshows and not how i need it

Answer 1

Yes, it is possible by removing the "delay()" function.
And with make your square absolute positionning.

I have fork your jsfiddle: http://jsfiddle.net/bouillard/n6grp/