JQuery - When a event is called, page should move

Question

Hi. I've a page on html. When i click on a submit button i call a Javascript function. I need (for example) go at the top of the page (or on another specified place, like in the middle where i have some div). I think there's a method for do it. How is called? Thanks

CODE :

<form onSubmit="return checkTL();" method='POST' action='./index.php?status=add' name='addtl' >
    somethings...
    <input type="submit" name="mgmttlt" value="Add Tracklist" />
</form>

function checkTL() {
    value=$('#inputa').val().replace( /[\\\s]+/g, '' );
    if(value=="") {
        $('#printe').removeClass().addClass('error').html("Please insert a valid Artist");

        var pos = $('.target').offset().top;
        $('html,body').animate({scrollTop: pos },1000);            

        return false;
    }

    return false;
}   

as example, i return always false in the function. But if i add the scrollTop function, in some mode it return true and the function go on. Why?

Answer 1

Use jQuery's ScrollTo Plugin. Example.

Answer 2

This can be done with out a plugin

Refer :.scrollTop()

Example :

$(function() {
  $('.button').click(function() {
    var pos = $('.target').offset().top;
    $('html,body').animate({scrollTop: pos },1000)
  });
});

You can test it here http://jsbin.com/ixabe3