Console.log the event that triggered page scroll to top

Question

How do I track down and console.log the event responsible for scrolling the page to top when content is finished loading? Note, there is nothing in the code that explicitly scrolls to top, but after the (jQuery) ajax content is successfully fetched and rendered, the page scrolls to top if user has already scrolled down a bit.

Is there a way to log what's triggering this behavior?

Is there a Chrome extension that allow the logging of all Javascript events?

Some things I've tried that did not help:

• no functions are run more than once (console.log shows once for each step)

• prevent scroll animation using

  $('html, body').stop(true,false).clearQueue().finish();
  

  doesn't help

• disable image lazy load plugin and other secondary plugins has no effect
• logging body height is correctly reported at each step of the ajax/callbacks
• adding return false; to $.ajax().success(),done(),complete() does not help

Ajax is triggered on document ready. The scroll to top happens after everything is loaded.

Answer 1

As your source code is not complete, i can only imagine that it's because of your anchor tag on <a href="#anchor"> element.

If there is no name="anchor" attributes, your #anchor tag will scroll your page to top. To prevent that, try this: <a href="#anchor" onclick="return false;">No more scrolling to top</a>.

The other case could be that there is already anchor present in your URL, check it and remove everything after # character in your URL, i.e.: www.website.com/contact/#anchor, remove #anchor and try again