animation with mouse over ?

animation with mouse over ?

Hi Guys,
i am very new to jQuery and i have some problems to stop or reset an animation after a mouseover event.

$(document).ready(function() {

    elementResize();
   
    $(".box1").bind("mouseenter ", function() {
        $(".boxtext1").animate({
            top: '-=100px',
            height: "show"
        }, 200, function() {
    // Animation complete.
  });
    });
});



Edit:
I added this:

    $(".box1").mouseleave(function() {
     $(".boxtext1").animate({
            top: '+=100px',
            height:"hide"
           
           
        }, 200, function() {
  });
    });   

The animation works fine now the main problem i have now is that the boxtext1 lays over the box1, so it starts allways to pump up and down if the mouse is over the boxtext1.
Any idea how to fix that ?