CSS动画，用贝塞尔曲线实现抛物线运动的思路是怎样的？

Question

如题，最近想用css动画来实现一个点的抛物线运动，我的做法是这样的：

<div class="container">
    <div class="inner"></div>
<div>

如上面的html，我外层平移X坐标，inner层平移y坐标，然后用贝塞尔曲线，但是出来的抛物线轨迹都非常生硬

Answer 1

给你这个地址
把曲线拉成你想要的变化就好了,加在animation-timing-function上
分别对当前元素的translateX跟translateY进行拆分，不用拆到两个元素上。