Using setInterval in jQuery's live events mouseOver/mouseOut
<p>Hey guys!<br />
I'm trying to start a timer when a user mouseOver an element and stop it on the mouseOut. The elements are created dynamically, which is the reason the use of the live method.</p>

<p>So my timer starts correctly, but I can't stop it! What's wrong?</p>

<pre><code>$elems.live('mouseover mouseout', function(event) {
        var self = $(this), i = 0;

        if (event.type == 'mouseover') {
            var timer = setInterval(function() {
                // change the src of the current element for an element of an array of src, much like in a slideshow
                self.attr('src', tabSrc[i]);
                i === 2 ? i = 0 : i++;
            }, 1000);
        }
        // Handle the mouseOut
        else {
            // stop the timer &lt;------ when I mouseOut the element, this doesn't seems to work...
            clearInterval(timer);
        }
    });
</code></pre>
