Question

I want to execute the following script

$('html, body').animate({
    scrollTop: $('#deckblatt').offset().top
}, 1)

deckblatt is the first content-div on my page.

Chrome won’t do this, but FF would.

The confusing part is that i’ve got the same excent method running on a second page, which works perfectly fine on both Chrome and FF.

What have i missed or is there maybe a better way to do what i want to achieve, preventing the browser from automatically jumping to a section of the page when it was scrolled down before?

Thank you in advance.

EDIT:

Here is the complete code for the first project, which is not running correctly

sprottenwels

And here is the code of the second one, which works fine

#2

Answer 1

It’s not a Chrome bug. Your original code contains some strange stuffs.

• You don’t have any elements with scroll-top class, which should be shown when scrolling down, and which the user could click on to scroll to the top.
• You don’t have any elements with top or bottom id like in the other one.
• You left out some needed CSS codes from the JSFiddle-code which you do have in the other working example.

• But one of the most important errors: target variable is undefined in your JavaScript code, and you inspect its equality with “#top” string. This leads to a ReferenceError exception. I think you wanted to inspect whether the click event’s target element’s id is equal to the "#top" string. For this, you should declare e.g. the event argument in the event handler, and use event.target.id.
  So instead of this:

  $('.scroll').click(function(){
  
      $('html, body').animate({
          scrollTop: $(this.id).offset().top
      }, 500);
  
      setTimeout("$('.scroll-top').fadeIn();",510 );
  
      if (target == "#top"){$('.scroll-top').hide() ;}
  
  });
  

  You should use this code:

  $('.scroll').click(function(event) { // declaring event variable as an argument
      $('html, body').animate({
          scrollTop: $(this.id).offset().top
      }, 500);
  
      // inspecting the id of the click event's target element
      if (event.target.id == "#top") {
        $('.scroll-top').hide();
      } 
      else {
        setTimeout(function () {
          $('.scroll-top').fadeIn();
        }, 510);
      }
  
  });
  

I modified your original code, uncommenting very much unneeded stuffs, but there are still many left:

http://jsfiddle.net/uKcQG/3/

It’s still a little buggy, but now the scrolling seems to work correctly.

But as I suggested in my comment, you should definitely use Ariel Flesler’s jQuery scrollTo plugin for this task: http://demos.flesler.com/jquery/scrollTo/