ciao
per presentare l'anteprima di un articolo utilizzo un div contenente come sfondo l'immagine dell'articolo stesso, e poi l'anteprima del testo posizionata in maniera assoluta in modo che sia appena al di sotto del div principale, e che al passaggio del mouse scorra tramite .animate()
stile
.anteprima_testo {height:100%;}
.anteprima_testo .titolo {position:absolute; top:10px; left:10px; border-radius:5px; padding:5px; background:#000; opacity:.80; filter:alpha(opacity=80); filter:"alpha(opacity=80)"; font-size:18px; color:#FFF;}
.anteprima_testo .testo {color:#FFF; background:#000; padding:10px; position:absolute; top:230px; opacity:.90; filter:alpha(opacity=90); filter:"alpha(opacity=90)";}
html
      <div class="anteprima_testo" style="background:url(immagini/art_1.jpg)">
        <p class="titolo">E' finita la cartaigienica</p>
        <p class="testo">testo anteprima testo anteprima testo anteprima testo anteprima testo anteprima testo anteprima testo anteprima testo anteprima testo anteprima testo anteprima testo anteprima </p>
      </div>
jQuery
    $('.anteprima_testo').mouseenter(function() {
      $(this).find('.testo').stop().animate({'top':($('.anteprima_testo').height() - $('.anteprima_testo .testo').height()) + 'px'}, 300);
    });
    $('.anteprima_testo').mouseout(function() {
      $(this).find('.testo').stop().animate({'top': $('.anteprima_testo').height() + 'px'}, 900);
    });
Nell'insieme funziona correttamente, ma se per caso il mouse si trova a sorvolare il box del testo, si innesca subito l'animazione di uscita, come se il mouse fosse uscito dal div principale.
Non riesco a spiegarmi come mai 