Spiegeln, aber Übersetzung stabil halten
P粉680087550
P粉680087550 2024-02-17 17:45:11
0
1
480

Wenn ich das Bild umdrehe, erfolgt auch die Transformation: Die Übersetzung erfolgt in die entgegengesetzte Richtung. Wie erreicht man eine Spiegelung der aktuellen Übersetzungsposition?

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>

Da das Bild mithilfe einer Funktion gezogen und die Transformation dynamisch aktualisiert wird, ist mit einer anderen Lösung als dieser zu rechnen ->

P粉680087550
P粉680087550

Antworte allen(1)
P粉909476457

你真的不再需要 transform-property,据我所知,你可以这样做:

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

scale 属性最多采用 3 个值,对应于 3 个轴 (x,y,z)。 如果仅提供 1 个值,则 x 轴和 y 轴均采用该值。这就是为什么您可以将其赋予值,第一个用于 x 轴,第二个用于 y 轴。

Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage