How to fix sidebar scrolling glitch in mobile Safari on iPhone?

Question

css

Good afternoon.
The topic will concern the left SideBar for the mobile version, I want to make a SideBar like MVideo. For me, it is fundamentally important to make the departure not of the left sidebar, but the departure of the main content to the right, under which the sidebar itself will be.

And also:
1. So that nothing jumps when scrolling.
2. So that you can scroll both the content part and the sidebar itself vertically.
3. Disable horizontal scrolling. As a ready-made solution, I found such a Tumpanus
script, I'm sure many people know it, the link to the demo is interested in effect No. 2 called REVEAL
Here you can download
it bug on youtube here
The point is that in mobile Google Chrome it works fine, but in mobile Safari there are occasional misfires with sidebar scrolling, jumps are observed (see video, link a little higher).
And yes, for Safari, a rule is added to the html in CSS for smooth scrolling

html {height: 100%;overflow-x:hidden;-webkit-overflow-scrolling:touch;}

A bit about the logic of the script

in the original script there is no setting for scrolling, I added it as follows: I added overflow-y: auto to the
.st -menu and .st-pusher blocks ;

.st-menu {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  visibility: hidden;
  width: 300px;
  height: 100%;
  background: #48a770;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  overflow-y: auto;
}
.st-pusher {
  position: relative;
  left: 0;
  z-index: 99;
  height: 100%;
  -webkit-transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  overflow-x: auto;
}

Attention question :)
How to remove sidebar scrolling glitch in mobile Safari on iPhone ?
I showed the glitch in the video, at the link on YouTube, see above.

Answer 1

Hello!
If you have user-select:none on any element then remove this property. For reasons unknown to me, it is in safari that this property starts to fail - it is impossible to enter text from an iPhone. Perhaps this will help you too. Perhaps you have *{user-select:none} somewhere (I had an error because of this - I searched for two days).
Also try using css auto-prefixes. They will automatically put down all the prefixes - maybe it will help. For example , autoprefixer.github.io/ru
I hope I helped you somehow. Hope you fix this glitch soon.
Sincerely, Evgeny.
UPD:
Try testing on another ios device. It is possible that in your device in safari some invalid files are cached and fail - this happens very often.