How to correctly add the .scrollTo plugin?

Question

I have this script, running on a links list:

$('li#linkcat-25 a').bind('click', function (e) {
    e.preventDefault();
    $('#preview').load($(this).attr('href'));
    $('#loading').show('fast');
    $('#preview').hide('fast');
    $('#preview').show('fast');
    $('#loading').hide('fast');
});

How can I easly add a .scrollTo effect, so that clicking on one of those href elements will show/hide as proposed, and when finished, will smoothly scroll down to the #preview div?

Thank you!

Answer 1

Hi already mentioned it in a previous question.

You could put those elements in a div and then use .animate to scroll. like

$("#divcontainer").animate({'scrollTop': '600'}, 4000);

Kind Regards

--Andy

Answer 2

You most likely want the scrollTo plugin which can be used like this:

$('li#linkcat-25 a').click( function (e) {
    e.preventDefault();
    // any hiding or showing can be done here
    $.scrollTo( $("#preview") );
})

You can also provide the scrollTo plugin with a number of other useful options. Info can be found on the scrollTo plugin page but the link to the demo might have moved here.