免费H5视频直播、点播播放器SkeyeWebPlayer自适应div宽高播放视频
1、 根据div宽高自适应显示播放(1)、通过设置播放器容器的样式,来使播放器宽高自适应<style>.web-media-player {position: relative;width: 500px !important;height: 300px !important;}</style><section class="container"><!--播
·
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>
更多推荐
已为社区贡献5条内容
所有评论(0)