Question

我正在尝试在用户滚动时为翻译（X，Y）设置动画。我已经实现了所有滚动功能，因为切换是瞬时的，它看起来很糟糕。

我似乎无法弄清楚如何为翻译制作动画。

在加载时，我的容器的值为-webkit-transform: translate(0%, 0%);，转到第二个“幻灯片”，它将更改为-webkit-transform: translate(0%, -100%);

我只是通过jQuery做到这一点：

 $('.container').css({"transform":"translate(0%,-" + positionY + "%)"});

（注意：我稍后会使用translate（x，y）来移动侧面。）

Answer 1

使用CSS transition property获得平滑效果。

.container {
    transition: transform 1s;
}

（您还需要供应商前缀来定位所有浏览器。）