Question

我想使用jQuery在x轴和y轴上获得图像的镜像。当用户点击按钮图像时，它会变为镜像。

我无法在互联网上搜索。

我刚用one solution使用css而不是jquery但是我需要jQuery用于这两个方向。

我想逐一进行这些反射意味着当我点击反射X按钮时，它应该反映在X轴和Y轴的类似情况。

所以我使用scaleX（-1）而不是scale（）用于x轴，但问题是当我这样做时，图像反射很好，但它的位置正在改变。你能帮我把它留在同一个地方，然后把它反射到x轴上。

感谢!!!

Answer 1

您可以使用CSS3镜像图像

-moz-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
transform: scale(-1, 1);

要在jQuery中使用它，你可以这样做：

 .mirror {
     -moz-transform: scale(-1, 1);
     -webkit-transform: scale(-1, 1);
     transform: scale(-1, 1);
  }

然后将类“mirror”添加到Object。

$('object').addClass('mirror');

让它恢复正常，只需删除它：

 $('object').removeClass('mirror');

Answer 2

您可以使用CSS。

transform: scale(-1, -1)

这会将X和Y都设置为-1。

第一个是X，第二个是Y.

来自MozDev：

transform:  scale(sx[, sy]);     /* one or two unitless <number>s, e.g.  scale(2.1,4) */