Hammer.js如何平移元素并逐步扩展？

Question

我想垂直平移一个元素，它会调整大小并最小化（转换比例和原点），直到我松开触摸时到达屏幕底部。我尝试重现的这种行为与youtube上的视频流的行为非常相似（当你向下拖动视频时，它会在屏幕的右下方发送容器）。

function dragStart(e) {
    var transforms = [];
    e.preventDefault();

    currentScale = adjustScale - (e.distance/1000);
    console.log(currentScale);
    currentDeltaX = adjustDeltaX + (e.deltaX / currentScale);
    currentDeltaY = adjustDeltaY + (e.deltaY / currentScale);

    transforms.push('scale(' + currentScale + ')');

    elem.style.transform = transforms.join(' ');
    elem.style.transformOrigin = "100% 100%";
}

这是我的代码示例：https://codepen.io/ACondur/pen/qVYeVJ

问题是：

如何让平底锅只接受垂直平底锅？

如何正确地缩放元素？

当元素达到我想要的宽度时，如何停止元素的平移？