CSS 动画在 Chrome 中不起作用（在 Webkit Mobile 上不受延迟）

问：

我正在尝试使用 translate3D 对 div 进行动画处理，它在任何地方都能完美运行，除了在 webkit-mobile 上，该属性得到了很好的解释，但 div 直接进入端点没有任何延迟。

我尝试使用webkit转换属性而没有任何区别，调试器告诉我一切都应该有效。

请告诉我你知道如何解决这个问题

JS公司

function setTransform(x, y, deg, duration) {
    current.style.transform = `translate3d(${x}px, ${y}px, 0) rotate(${deg}deg)`
    likeText.style.opacity = Math.abs((x / innerWidth * 2.1))
    likeText.className = `is-like ${x > 0 ? 'like' : 'nope'}`
    if (duration) {
      current.style.transition = `transform ${duration}ms`
      current.style.webkitTransition = `transform ${duration}ms`
      // debugger;
    }
}

“current”元素的 CSS

.card {
    position: absolute;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    height: 100%;
    color: #f1f1f1;
    border-radius: 10px;
    user-select: none;
    cursor: pointer;
    overflow-y: scroll;
    touch-action: none;
    flex-direction: column;
}

编辑： x，y，deg 工作完美，持续时间约为/应该在 1000 毫秒左右