ios - 使用 3D 变换隐藏元素

Question

在隐藏或显示 div 时不使用 display:none 和 display:block，我决定为此任务使用 CSS 转换，因为它在 iOS/Android WebApp 中工作得更快、更流畅。

基本上，我使用 transform: translate(0px,0px) 来显示一个 div，并通过 transform: 来隐藏它:翻译(100000px，100000px)

现在这在 iPhone 上按预期工作，但在 iPad(或桌面)上它不能正常工作。我得到一个巨大的垂直滚动条(可能是由于翻译)，overflow:hidden 似乎也没有帮助。任何想法表示赞赏。你们是如何实现这个translate-for-hiding-elements-solution的？

Answer 1

您可以通过简单地插入一个 - 来解决这个问题。

改为这样做:

transform:translate(-100000px,-100000px); /*Both negative values*/

这样，您将它“倒退”在页面中并且滚动条不会显示，但它仍然会在那里。它与当前方法相同，但只是朝不同的方向前进并防止出现滚动条。