search

willmcpo / body-scroll-lock

Body scroll locking that just works with everything 😏
MIT License
4.04k stars 338 forks source link

Safari toolbars on iOS 15 show and hide when scrolling within a scrollable element #236

Open alexfoxy opened 2 years ago

alexfoxy commented 2 years ago

Testing the modal example on iOS 15 safari. Even though the body is locked in scroll position Safaris toolbars disappear / re-appear when scrolling inside a scrollable element. See video: https://user-images.githubusercontent.com/151772/136651702-113ee9db-3e0c-4c33-b161-ad676a39c27d.mov

This is present in iOS 15.1 beta 3 also.

PASHANSX commented 2 years ago

The latest version body-scroll-lock has not been uploaded to npm. The problem was that: from document.body.style.top = -scrollY; document.body.style.left = -scrollX; to document.body.style.top = ${-scrollY}px; document.body.style.left = ${-scrollX}px;

If you use the code from github, then everything will work correctly. But if you download from npm, you will get a bug.

alexfoxy commented 2 years ago

I tried out the latest version from the repository and it is still an issue on iOS 15: https://codesandbox.io/s/bsl-ios15-z647i

benoitbohnke commented 2 years ago

Same here on 15.0

One1L commented 2 years ago

Pls update banner in readme https://imgur.com/Wyl0Erw

rick-liruixin commented 1 year ago

They stopped the repairs. I had to do it myself, in the same way, with a new version of typeScript. And fix these problems for everyone to use.

npm i body-scroll-lock-upgrade

repair log，Refer to the releases page.

rick-liruixin commented 1 year ago

最新版本的 body-scroll-lock 还没有上传到 npm。 问题在于： from document.body.style.top = -scrollY; document.body.style.left = -scrollX; 到 document.body.style.top = ${-scrollY}px; 文档.body.style.left = ${-scrollX}px;

如果你使用来自 github 的代码，那么一切都会正常工作。但是如果你从 npm 下载，你会遇到一个错误。

They stopped the repairs. I had to do it myself, in the same way, with a new version of typeScript. And fix these problems for everyone to use.

npm i body-scroll-lock-upgrade

repair log，Refer to the releases page.