Javascript - Stop a repeating function
<blockquote>
  <p><strong>Possible Duplicate:</strong><br>
  <a href="http://stackoverflow.com/questions/2626005/how-to-pause-a-settimeout-call">How to pause a setTimeout call ?</a>  </p>
</blockquote>



<p>I have a function that gets called on page load which starts off a repeating function:</p>

<pre><code>        setTimeout(function () {
            repeat();
        }, 8000)
</code></pre>

<p>This function calls <code>repeat()</code> every 8 seconds, inside this function I have a bit of ajax which updates a counter on the page. Clicking on the counter gives the user a drop down menu with a number of messages. The counter value equals the number of messages the user has. Kind of like Facebook notifications.</p>

<p>When clicking the drop down menu Im using jQuery to hide and show it:</p>

<pre><code>  $('#messages').click(function () {
        $('#messagesDropDown').slideDown();
    })
    .mouseleave(function () {
        $('#messagesDropDown').slideUp();
    });
</code></pre>

<p>When the <code>#messagesDropDown</code> is visible I want to stop the <code>repeat()</code> function, to prevent the list of messages from updating while Im viewing the current ones.</p>

<p>On .mouseleave I want to start the <code>repeat()</code> function again.</p>

<p>Anyone have any ideas how I can 'STOP' a repeating function In the <code>.click</code> function and start it again on <code>.mouseleave</code> ?</p>
