onmouseover 1st div should occupy 2nd div vise versa

[evanrox]

Main Div Width and height are 900px/400px

Have two divs all floated left and width 420px, height 300px .

on mouseover 1st div should occupy 2nd div by hidding the 2nd div.

vise versa on mouseover 2nd div it should occupy 1st div.

how can i make this with jquey effects (toggle etc)