Doesn't work on iOS mobile devices

[dancherb]

Works great on desktop browsers and the mobile device view in Chrome's dev tools.

On iOS Safari, Chrome and Firefox, the body scroll locks but I'm unable to scroll in the modal opened by touching. Two-finger scroll seems possible but is buggy and also scrolls in the body element.

[diachedelic]

Are you talking about the this demo?

[gauthierblanpain]

Have you got your target element set as the element that is meant to carry on scrolling? i.e. the element with overflow: auto

I was experiencing exactly the same issue you are and it was because I was accidentally targeting the parent element to the div actually doing the scrolling.

[fresswolf]

Are you talking about the this demo?

Exactly this demo doesn't work on iOS 14.2. Once you first scroll down a bit to hide the bottom safari navigation bar and then open the modal, one can still scroll the body.

[jvitela]

could you have a look at this pull request and see if that solves your problem? https://github.com/willmcpo/body-scroll-lock/pull/207

[snowsergo]

Works great on desktop browsers and the mobile device view in Chrome's dev tools.

On iOS Safari, Chrome and Firefox, the body scroll locks but I'm unable to scroll in the modal opened by touching. Two-finger scroll seems possible but is buggy and also scrolls in the body element.

Hellow, I have the same problem. Please, can you say how did you fixed this.

[jvitela]

Hi, @snowsergo please make sure you are testing with the branch from this pull request: https://github.com/willmcpo/body-scroll-lock/pull/229. That branch contains the latest fixes which are not yet merged to the main branch.

[charkour]

To enable scrolling of target elements on iOS, you need to enable it in options.

disableBodyScroll(currentReference, { allowTouchMove: () => true });

[bradleykhan]

@charkour This works at the expense of re-enabling body scroll behind the modal it seems

[charkour]

@bradleykhan, yeah you're right. This package is a little buggy and it appears to be no longer maintained. My team is looking for a better solution but this is the best we've found for now.

Thanks for your comment!

[diachedelic]

@charkour Did you try https://github.com/tuax/tua-body-scroll-lock?

[charkour]

@diachedelic, hi!

Yeah, we initially tried that too but ran into issues when trying to use multiple locks. Didn't try too long. Seemed to work better than this package in more cases so it's worth a shot in my opinion!

[rick-liruixin]

@bradleykhan，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 Changelog Refer to the releases page.

[rick-liruixin]

在桌面浏览器和 Chrome 开发工具中的移动设备视图上运行良好。 在 iOS Safari、Chrome 和 Firefox 上，主体滚动锁定，但我无法在通过触摸打开的模式中滚动。双指滚动似乎是可能的，但有问题，并且还会在 body 元素中滚动。

你好，我有同样的问题。拜托，你能说说你是怎么解决这个问题的吗？ 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.