I have made this simple content rotator with jQuery which works fine, but as you can see I have made a mouseenter function so that the rotator stops if your mouse in on the rotator. 

My problem is that if I mouseenter and leave the function *rotateReview()* is restarted and the count variable (number) is 1. So automatically my rotator starts at the beginning where he should continue to the next one.

**HTML:**

```
<div id="review_rotator">
   <div class="rotator">
      <article>Content</article>
      <article>Content</article>
      <article>Content</article>
      <article>Content</article>
   </div><!--End .rotator-->
</div><!--End #review_rotator-->

```

**jQuery**

```
function rotateReview() {
    var turn = $('#review_rotator article');
    var numbers = turn.length;
    var number = 1;
    intv = setInterval(function() {
        number++;
        turn.fadeOut(300);
        $('#review_rotator article:nth-child('+number+')').fadeIn(200);
        if(numbers == number)
            number = 0;
    }, 4500)
}
rotateReview();

$(document).on('mouseenter mouseleave', '#review_rotator article', function(e) {
    var mEnt = e.type == 'mouseenter';
    if(mEnt) {
        clearInterval(intv);
    } else {
        rotateReview();
    }
})

```