caricamento div al posto di un altro on mouseover

[pettedemon]

Ciao a tutti,
sto cercando con jquery di sostituire un div al passaggio del mouse ma anche di farlo ricomparire quando il mouse non è più sopra...
Questo è il codice jquery

<script type="text/javascript">
$(document).ready( function(){ 
jQuery('#vedi_sopra_disc').hide();
jQuery('#vedi_sotto_disc').hide();
    
                            
$('#news_reader_sms').innerfade({ animationtype: 'slide', speed: 750, timeout: 2000, type: 'random', containerheight: '1em' }); 
                
$("#sopra_disc").hover(
function () {
    jQuery('#sopra_disc').hide();
jQuery('#vedi_sopra_disc').fadeIn(1000);
},
function () {
    jQuery('#vedi_sopra_disc').hide();
jQuery('#sopra_disc').fadeIn(1000);
}
);
    
} ); 

e questi i miei div

<div id="sopra_disc"></div>
<div id="vedi_sopra_disc"></div>
<div id="sotto_disc"></div>
<div id="vedi_sotto_disc"></div> 

non riesco a gestirli... Come posso fare? Oppure è impossibile ?
Grazie!