stop a jquery animation loop (function and nested)
<p>How would i stop a jquery animation from loading upon user interaction?</p>

<pre><code>    $('#jqNav li a').click(function(){

    if($(this).parent().is(".nav1")){ $('.landing .main .nav ul').css({ "background-position" : "0 -50px" });} 
    else if($(this).parent().is(".nav2")) { $('.landing .main .nav ul').css({ "background-position" : "0 -100px" });}
    else if($(this).parent().is(".nav3")) { $('.landing .main .nav ul').css({ "background-position" : "0 -150px" });}
    else if($(this).parent().is(".nav4")) { $('.landing .main .nav ul').css({ "background-position" : "0 -200px" });};

    $page = $(this).attr('href');
    var $hashTag = $(this).attr('name');
    window.location = "#" + $hashTag;
    loadData();
    return false;
});
</code></pre>

<p>this is the user click function;</p>

<pre><code>    function doReplay(){
    $('body')
    .fadeTo(0,1,function(){
        $page = $welcome;
        loadData();

    })
    .delay(1000)
    .fadeTo(0,1,function(){
        $page = $startup;
        loadData();
    })
    .delay(1000)
    .fadeTo(0,1,function(){
        $page = $to2m;
        loadData();
    })
    .delay(1000)
    .fadeTo(0,1, function(){
        $page = $to25m;
        loadData();
        setTimeout(function(){doReplay();},5000);
    });
}
</code></pre>

<p>and the above is the animation function</p>

<p>I have tried clearTimeout but it doesn't seem to work.</p>
