All geek questions in one place

ScrollTop on page reload does not work (script conflict is possible)

I am working on this page http://dindita.com/preview.html

I added this to make it scroll up when someone refreshes the page, but it doesn't seem to work, I wonder if it conflicts with other scroll scripts that I use.

<script type="text/javascript"> $(document).ready(function(){ $(this).scrollTop(0); }); </script>

Any clue?

Ps: Work in progress: messy scripts

+6
source share
5 answers

Try the following:

 $(document).ready(function() { $("html,body").animate({scrollTop: 0}, 100); //100ms for example });

Or that:

 window.onload = function() { setTimeout (function () { scrollTo(0,0); }, 100); //100ms for example }

Or that:

 $(window).on('beforeunload', function() { $(window).scrollTop(0); });

Browsers typically return to their last scroll position on reboot, which makes sense in many cases. It seems that this automatic transition starts immediately after the onload event (but we don’t know the exact moment when this happens), so it makes sense to either use some delay or scroll the browser up until the page reloads;)

+24
source

Browsers (at least Chrome) change the scroll position after the page loads, and not when the DOM is ready.

 $(window).load(function(){ $('html, body').scrollTop(0); });

If this does not work (the script is still running before the browser changes the scroll position), you can set a timeout:

 $(window).load(function(){ setTimeout(function() { $('html, body').scrollTop(0); }, 10); });
+5
source

I had a moment of Eureka when I tried this and it worked:

 <script> location.hash = (location.hash) ? location.hash : " "; </script>

In the <head> your html. Not sure if the app is for one page! But sure works like a spell on regular pages.

+3
source

This is what I came up with to scroll up, but only when the document is not already at the top, and is delayed enough so as not to cause problems starting it properly:

 $(window).load(function() { setTimeout(function() { if ($(document).scrollTop() !== 0) $("html, body").animate({ scrollTop: 0 }, 'fast'); }, 300); });
0
source

Calling scrollTo and again scrollTo with a timer for 10 ms and changing the value for 1 pixel completed the task. Work with chrome and safari for each forced update.

 w = 200; scrollTo(w - 1, 0); window.setTimeout (function (){scrollTo(w, 0);}, 10);
0
source

Source: https://habr.com/ru/post/954806/

More articles:


All Articles