阿里云首页 音视频通信

H5端如何实现镜像及显示横屏录制的视频

Web SDK本身不提供镜像和横竖屏接口,需要您自己实现。通过阅读本文,您可以了解实现H5端镜像及显示横屏录制视频的方法。

H5端镜像

通过给video标签设置css,来实现镜像功能。

{
        transform: rotateY(180deg);
        -webkit-transform: rotateY(180deg);
        -moz-transform: rotateY(180deg);
} 

显示横屏录制的视频

在video标签外增加一个div标签,并在div上设置css,来显示远端横屏录制的画面。

{
   transform: rotate(90deg);
   -webkit-transform: rotate(90deg);
   -moz-transform: rotate(90deg);
}

首页 音视频通信 常见问题 其他问题 H5端如何实现镜像及显示横屏录制的视频