Question

功能

用户站在相机前拍照。

已完成的工作：

利用<video>捕获动态影像并创建了一个＆＃34;拍照＆＃34;按钮捕获图像以施加静止图像。还包含了缩放功能。

问题：

图像是镜像的。因此，当用户向左移动时，视频输入中的图像将向右移动，当用户向左移动时，视频输入中的图像将向右移动。

我更改了以下transform:rotateY()，但它仍然给我相同的功能，当用户向左移动时，相机Feed中的图像向右移动，反之亦然。因此，我做错了什么，如何纠正以下问题。

＆＃13;

.camera_feed_flip {
  transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  /* Safari and Chrome */
  -moz-transform: rotateY(0deg);
  /* Firefox */
  transform: scale(1.0);
}

＆＃13;

<div id="CameraFeed" align="center" style="position:absolute; widths:1080px; height:1920px; background-repeat: no-repeat; display: none; z-index=7; top:600px; left:0px; ">

  <video id="video" width="1300px" height="1350" class="camera_feed_flip" style="position:absolute; z-index:16; top: 600px; left:-110px" autoplay></video>
</div>

＆＃13;

Answer 1

我根本不知道变换css，但是让我觉得你将图像旋转了0度（因此根本没有改变它）。不应该是180度？

.camera_feed_flip {
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  /* Safari and Chrome */
  -moz-transform: rotateY(180deg);
  /* Firefox */
  transform: scale(1.0);
}

然后我从未使用过这个CSS。我可能不准确，因此给你一个不正确的解决方案 - 对不起，如果是这样的话：）

<video>图像Feed是镜像，如何将图像转换为非镜像

1 个答案: