鏡像但保持平移穩定

Question

當我翻轉影像時，也進行變換：平移方向相反。 如何實現目前平移位置的鏡像？

img {
  transform: translate(50px, 100px);
  /* scale:-1; */
}

<img class="draggable" src="https://cdn.pixabay.com/photo/2016/03/28/12/35/cat-1285634__340.png" width=200>

由於映像正在使用函數拖曳並動態更新變換，因此期望找到與此解決方案不同的解決方案 -> 變換：translate(50px, 100px) scale(-1);

Answer 1

你真的不再需要 transform-property，據我所知，你可以這樣做：

img {
  translate: 50px 100px;
  scale: -1 1;
}

scale 屬性最多採用 3 個值，對應於 3 個軸 (x,y,z)。 如果僅提供 1 個值，則 x 軸和 y 軸均採用該值。這就是為什麼您可以將其賦予值，第一個用於 x 軸，第二個用於 y 軸。