Scrolling disabled after navigating back on safari 9.1.2

Question

First of all, my apologies that I don't have a minimal, verifiable test case. The issue that I'm having occurs on Safari, but I don't own any Apple products.

On this website, there is a bug where the user can't scroll the page anymore after navigating back. You can follow the link, click on one of the buttons, go back (by swiping, clicking the button or using a shortcut) and then you won't be able to scroll the page anymore by using either the trackpad or mousewheel. I'm basically clueless as to what could be causing this.

The user that reported this is using Safari 9.1.2

Answer 1

In short:

I believe the answer is: Nothing is wrong with your website's code.

---

In fact, I believe it is hardware related and that is why many people can not reproduce this problem and it only affects some users.

I have tested the site on every OS from Lion/Safari 6 to El Capitan/ Safari 9, with a trackpad and magic mouse, using my Macs and Browserstack.

In every scenario, the site was functioning normally.

As you have stated, track pads are affected and I would like to add that any 2 finger swiping may be the exact reason and 1 finger swiping is not.

And The reason I say it is hardware related: because users on Apple ran forums are complaining about this same problem and have said a PRAM reset is what corrected the problem.

Swipes and scrolling stop working in Safari

More users on Apple forums voice their complaints.

Apple users place the blame on everything from OS upgrades to system bugs and failing hardware .

---

In the End: One thing is certain. I have not seen one user claiming that it's a result of a website's coding.

Answer 2

i cannot test it 'cause i havn't any OSX but i've never had this problem when developing any website. Try to do not rely in overflow specifications on body, let it auto. If something overflows the page in X-line then you've something bad-structured or bad-styled (if talking about responsive web development). If something overflows in Y-line then it will be scrollable anyway even if you don't declare it on body's styles.

Then you declared box-sizing: border-box; AND position: relative; to all elements (*, *:after, *:before). Delete it too, no need to re-declare those properties and may cause issues when dealing with different elements. Think that html elements have default properties, the good habit is to learn and understand it, not to change it as you want crazily...

Finaly, if you inspect the console you'll find some jquery errors that may cause lock some css classes or issues on page load.

1- Delete body's overflow declarations.  

2- Delete * stylings (* styles must be used only to homogenize text, as font  family and font width, or other few generic non-structure modificable things)

3- repair JQuery errors.

Hope it helps, Cheers!