ionic中使用video标签全屏播放视频

ionic 全屏播放视频

ionic 中用 html5 的 video 标签播放视频，但是全屏的时候会黑屏。现在通过旋转手机屏幕和样式调整的方式，来模拟全屏视频播放。

• 源码地址

扫码下载App

效果演示

依赖

安装 Screen Orientation 插件

ionic cordova plugin add cordova-plugin-screen-orientation

npm install @ionic-native/screen-orientation

复制代码

使用

1. 添加 video 标签

<div class="video-player" [ngClass]="isFull? 'full' : 'original'">
  <video
    crossorigin
    controls
    controlslist="nodownload nofullscreen"
    src="assets/videos/ice-age.mp4"
    #player
  ></