模态出现后不可点击-Safari

Question

仅限Safari浏览器

我在桌面Safari上遇到了奇怪的错误。 我想在滚动网站时到达某个点后显示模式。不幸的是，当我们在野生动物园上执行此操作时，模态是不可点击的（z索引问题？）。我一直在使用react + react-modal，但是我认为这个问题与其中任何一个都不相关。

源代码+演示：https://codesandbox.io/s/p5x9331y8x

我注意到，当我们将触发函数包装在setTimeout()中时，我们将能够看到模式仅在滚动事件出现时才停止工作。 https://codesandbox.io/s/3q7rmpj1mq

Ofc setTimeout()在这里不是解决方案... 我发现与此有关的问题，但其中任何一个都不完全符合我的问题：

• https://github.com/reactjs/react-modal/issues/369
• https://css-tricks.com/forums/topic/safari-for-ios-z-index-ordering-bug-while-scrolling-a-page-with-a-fixed-element/

另外，当主体上没有overflow: hidden时，它也可以正常工作，但这也不是解决方案（显然，我们希望防止背景滚动）。

注意：关于演示，模态在到达页面的最后一部分后出现（此问题被重新创建）。最好全屏打开页面进行测试。

任何帮助将不胜感激。

Answer 1

问题已从overflow: hidden更改为overflow-y: hidden ...