1、 依据div宽高自适应显示播放
(1)、通过设置播放器容器的款式,来使播放器宽高自适应
<style> .web-media-player { position: relative; width: 500px !important; height: 300px !important; }</style><section class="container"> <!--播放器容器--> <div class="web-media-player" id="SkeyeWebPlayer"></div> <div class="play-url"> <input type="text" id="url" value="rtsp://192.168.0.111:5540/00000000031316423888/0"> <button class="btn" onclick="play()">播放</button> </div></section><script type="application/javascript"> let player = null initPlayer() // 初始化播放器 function initPlayer() { // new WebMediaPlayer(url,domId,callback,options) player = new WebMediaPlayer( '', `SkeyeWebPlayer`, callbackFunc, { cbUserPtr: this, decodeType: 'auto', openAudio: 0, BigPlay: false, Height: 0 // 设置为0 }); } // 播放 function play() { let url = document.getElementById('url').value player.play(url, 1, 0) } // 回调 function callbackFunc(cbType, cbParams) { console.log(cbType, cbParams) }</script>