html - 在视口之外预渲染 translate3d 内容

Question

我想开发带有一些动画的移动网站，但是有一些渲染（？）问题。

所有转换都使用与此类似的类完成：

.move{
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
    -webkit-transition-duration: .25s;
    transition-duration': '.25s;
}

我遇到了在视口之外的 div 的问题，然后在按下按钮或类似的东西后滑入。div 在移动时被绘制，但只是第一次。如果他们稍后滑出视口然后又回来，它非常流畅和漂亮。

我试过给css属性，比如-webkit-backface-visibility: hidden; & -webkit-perspective: 1000;，但没有任何区别。任何想法？谢谢。

Answer 1

我有您描述的相同问题，为网站创建抽屉式导航（类似于许多移动应用程序的工作方式，如 Facebook）。还没有找到答案。