Div 不读取带有 backface-visibility:hidden 的点击事件

发布于 2024-12-01 01:25:11 字数 553 浏览 0 评论 0原文

我正在尝试淡入我为 iPad 构建的 web 应用程序中的 div 。 iPad 在尝试使用 jQuery 的 fadeIn() 方法时会卡住,因此我尝试使用 -webkit-transition: opacity 1s Linear 进行转换,并使用 javascript 将不透明度更改为 0 或 1。它看起来非常平滑,只是在淡入淡出结束时闪烁得非常刺耳。

据我了解此处不久前,当我设置 -webkit-backface-visibility: hide 时,这种闪烁立即消失。不幸的是,当我设置了该设置后,div 不再检测用于关闭它的单击或 touchstart 事件。我非常有信心这就是问题所在,因为当我在检查器中删除该属性时,它会完美地读取点击次数。我发现其他人在 SO 的评论中提到了类似的错误,但没有给出解决方案。

有谁知道如何解决这个问题?

I'm trying to fade in a div in a webapp I'm building for iPad. The iPad chokes trying to use jQuery's fadeIn() method so I'm trying to do the transition with -webkit-transition: opacity 1s linear and changing the opacity to 0 or 1 with javascript. It looks pretty smooth, except that it flickers once quite jarringly at the end of the fade.

As I learned here a while back, this flicker instantly disappears when I set -webkit-backface-visibility: hidden. Unfortunately, when I have that set, the div no longer detects the click or touchstart events used to dismiss it. I'm very confident this is the problem because when I remove that property in the inspector, it will read clicks perfectly. I found someone else mention a similar bug in a comment on SO but no solution was given.

Does anyone have any ideas how to work around this?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

苯莒 2024-12-08 01:25:11

诀窍是我试图读取点击的 div 位于折叠的 0x0 div 中。有点奇怪的是 backface-visibility 会成功或破坏它,但我能够通过使之前折叠的容器完整大小并添加 js 使其显示块并在不同时间不显示来解决该问题。

The trick was that the divs I was trying to read the click on were in a collapsed 0x0 div. It's a bit bizarre that backface-visibility would make or break that, but I was able to fix the problem by making the previously collapsed container full size and adding js to turn it display block and none at various times.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文