stop animationskøen

Jeg har lavet en animation af et div element, med mouseenter/leave. Hvordan får jeg den til kun at køre animationen én gang. Hvis jeg kører musen henover imens animationen kører, bliver der lavet en kø af animationer, som efterfølgende bliver afviklet. hvordan stopper jeg det? Havde håbet jeg kunne bruge stop()...

$("#link_front_periode").stop().mouseenter(function(){
    $( "#link_front_periode_pic" ).animate({
            top: '-=13px',
                left: '-=26px',
                height: '+=26px',
                width: '+=52px'
    });
    $( "#link_front_periode_pic" ).animate({
                top: '+=3px',
                left: '+=6px',
                height: '-=6px',
                width: '-=12px'
      });
          $("#link_front_periode2").css({ 'text-shadow': '0 0 0.4em #d6770b'});
    });

    $("#link_front_periode").stop().mouseleave(function(){
        $( "#link_front_periode_pic" ).animate({
                top: '+=10px',
                left: '+=20px',
                height: '-=20px',
                width: '-=40px'
            });
        $("#link_front_periode2").css({ 'text-shadow': 'none'});
    });