0

Here is what I am trying to do: When the user is clicking a button, a transparent overlay is opening. The background shouldn't be scrollable but stay at the scroll position. So what I am doing at the moment is that once the button is clicked, I safe the current scroll position via window.scrollY, then add overflow: hidden to both the html and body tag (which unfortunately scrolls the page to the very top), then proceed to scroll to the saved position inside the main div of the website. In most browsers these steps aren't noticeable so it seems like everything just stays at the same position. In Safari however, you can see that for a few ms the background scrolls to the very top and then back again.

So what I would like to know is how to execute multiple methods at once before the DOM updates. Or maybe you can think of another way of doing this?

Thank you!

Hillcow
  • 677
  • 15
  • 37
  • Have you seen this? https://stackoverflow.com/a/10796586/4971311 It's probably better to avoid having the page to scroll to the top, so you don't have to store positions or do other tricks – zizzo Jul 11 '18 at 11:19
  • Thank you, yes, but that didn't work. It did not keep the position. However, this worked: https://stackoverflow.com/questions/6411282/how-to-lock-scrolling-of-a-web-page-temporarily/6411611#6411611 – Hillcow Jul 11 '18 at 13:36

0 Answers0