使用jquery获取图像的镜像

Question

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

我无法在互联网上搜索它.

我只是使用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);
  }

然后将类"镜像"添加到Object.

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

要使它恢复正常,只需删除它:

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