Question

I have a jQuery script that scrolls down to the end of a text area box. This function is inside a Interval based auto div reloader (Script Below). I want to make it so when someone is scrolling in the text area, the part of the script scrolling it down is deactivated.

var refreshId = setInterval(function()
{
    $('#chatArea').load('run/chatBox.php', function() {     
            $('#chatAreaBox').scrollTop($('#chatAreaBox')[0].scrollHeight);
    });
}, 2500);

Answer 1

Just check the scrollTop value to know if the user has scrolled down before executing animation

var refreshId = setInterval(function()
{
    $('#chatArea').load('run/chatBox.php', function() {    
            if($('#chatAreaBox').scrollTop === 0)
                $('#chatAreaBox').scrollTop($('#chatAreaBox')[0].scrollHeight);
    });
}, 2500);

You could also store the timestamp (using date()) in a scroll() event and check it in your interval function, then execute the animation if the last scroll event occurred more than 5 seconds ago

var timestamp = null;

    $('#chatArea').scroll(function() {    
        var d = new Date();
        timestamp = d.getTime();    
    });


var refreshId = setInterval(function()
{
    $('#chatArea').load('run/chatBox.php', function() { 

        var d = new Date();

            if((d.getTime() - timestamp) > 5000)
                $('#chatAreaBox').scrollTop($('#chatAreaBox')[0].scrollHeight);
    });
}, 2500);