jQuery scrollTo or animate do not scroll page

Question

I am trying to do something simple: when the user clicks on a div, the whole page scrolls to a certain location. I have done this before, but somehow this seems to not be working now. I mean, for now I just want any scrolling to happen to know that the plugin works.

It's quite simple really: $.scrollTo(500, 500) should be working, but nothing reacts, no error is thrown.

Here is a link to a dummy version of what I am doing: http://jansensan.net/dump/jquery-scrollto-issue/ Simply click on the black div at the bottom right to see... nothing happening. You may also look at the full code: http://jansensan.net/dump/jquery-scrollto-issue/js/global.js.

Is there anything in CSS that could break that functionality?

Answer 1

Your JavaScript says:

function scrollToTouts()
{
    // FIXME: whatever I do here, nothing scrolls
    $.scrollTo(500, 500);
}

Don't you need to supply the target of the scroll?

e.g.

$.scrollTo('#content', 500, 500);

or

$.scrollTo('body', 500, 500);

Answer 2

It seems I was relying on wrong examples, $.scrollTo("#bottomContent", 1000, {easing:"easeInOutCubic"}); does work, sorry if for some of you this issue was obvious.

Answer 3

You can do like this:

$('html, body').animate({
  scrollTop: $('#elementID').offset().top
}, 1000);

Replace #elementID with the id of the element you want to scroll to with animation.

Check out the actual implementation by click on Request Quote link at bottom.