video.js

源碼地址:

https://github.com/videojs/video.js/

 

設定寬高比

https://docs.videojs.com/tutorial-layout.html

// make a vertical video
var player = videojs('vid1', { aspectRatio: '9:16' });

 

<video style="width: 100%; height:100%; object-fit: fill" 

            x-webkit-airplay="allow" 

            x5-playsinline="" 

            x5-video-player-type="h5-page"  //微信官方事例安卓內小窗播放     x5-video-player-type="h5"  不行

            controls="controls"

            webkit-playsinline="true" 

            playsinline="true" 

            id="my-video"

            autoplay="true"

            class="video-js vjs-big-play-centered"

            preload="auto"

            poster="@Model.Room.Logo"

            data-setup='{}'>

        <source src="http://61.133.87.227:1935/live/5YE1QLU75VM0/playlist.m3u8" type="application/x-mpegURL" id="target">

            

        </video>

 

官方事例地址：

https://tencentx5.github.io/x5/video_page_samelayer.htm