scroll back to top animation doesn't work

Question

Afternoon

Problem: Instead of scrolling to the top with animation my "back to the top" button (down-right corner after scrolling down) jumps right to the top.

Example can be found on http://www.pixsters.be

My html:

<a href="#top" id="homebacktothetop"><span>backtothetop</span></a>

My js (jquery):

            // scroll to 0 when clicked
            $('#homebacktothetop').click(function () {
                $('body,html').animate({
                    scrollTop: 0
                }, 800);
                return false;
            });
        });

Answer 1

Change 'body,html' to window

$('#homebacktothetop').click(function (e) {
    $(window).animate({
         scrollTop: 0
     }, 800);
     e.preventDefault();
});

Answer 2

typo: you try to call

function gotoByScroll(id)
{
     $('html,body').animate({scrollTop: $("#"+id).offset().top},'slow');
}

with

$("#homebacktothetop").click(function(){goToByScroll("#container");});

Which gives you a Uncaught ReferenceError: goToByScroll is not defined in the console, javascript is case sensitive

Answer 3

This works for me:

         $(document).ready(function(){
              $("#GoToTop").click(function()
              {
                 $("html, body").animate({ scrollTop: 0 }, 500);
                return false;
              });
            });

Answer 4

This is a complete shot in the dark, but have you tried removing the return statement? I was looking at a similar post, jquery animate, scroll top top slow , and they got the same script to work, but they have no return statement.

On a completely different topic, you're getting these Javascript errors in your page:

Might wanna look into that, it seems like therein lies your problem. Good luck!

Answer 5

Looks to me like you got your code from Web Designer Wall . I noticed in your code that on line 32 you overwrite the click event for #homebacktothetop with a new function.