<video> подачи изображения в зеркальном отражении, как преобразовать изображение в незеркальном изображение

Question

функциональность:

Пользователя стоять перед камерой и сделайте снимок.

Что было сделано:

использовал из <video> захвата движения изображения и создали кнопку «Сделать снимок», чтобы захватить изображение, чтобы наложить неподвижное изображение. Также включили функцию масштабирования.

Выпуск:

Изображение зеркально. Поэтому, когда пользователь перемещается влево, изображение в видеопотоке будет перемещаться вправо, а когда пользователь перемещается влево, изображение в видеопотоке будет двигаться вправо.

Я изменил следующее transform:rotateY(), однако он по-прежнему дает мне ту же функциональность, при которой пользователь перемещается влево, изображение в канале камеры перемещается вправо и наоборот. Следовательно, что я сделал неправильно и как исправить следующую проблему.

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

<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>

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. Возможно, я не могу быть точным и, следовательно, вы не ошибаетесь, - извините, если это так.