liveplayer免费网页直播|点播播放器-页面动态多播放器添加代码示例

原创

Marvin1311 2022-07-23 00:30:24 ©著作权

文章标签 LivePlayer LiveQing 视频直播视频点播代码示例 文章分类 音视频

©著作权归作者所有：来自51CTO博客作者Marvin1311的原创作品，请联系作者获取转载授权，否则将追究法律责任

强大的网页直播/点播播放器，使用简单，功能强大， 终身免费使用

支持m3u8播放;
支持HTTP-FLV播放;
支持RTMP播放;
支持直播和点播播放;
支持播放器快照截图;
支持点播多清晰度播放;
支持全屏或比例显示;
自带的flash支持极速和流畅模式;
自带的flash支持HTTP-FLV播放;
自动检测IE浏览器兼容播放;

详见：https://www.npmjs.com/package/@liveqing/liveplayer

压缩包下载

多播放器页面添加示例

<!DOCTYPE HTML>
<html>
    <head>
        <title>liveplayer</title>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
    </head>
    <body> 
    <div id="liveplayers"></div>
    <script type="text/javascript" src="liveplayer-element.min.js"></script>
    <script type="text/javascript">
        var players =[
        "video_url_1",
        "video_url_2",
        "video_url_3",
        ]
        var liveplayers = document.getElementById("liveplayers");
        
        for (var i=0;i<players.length;i++) {
            var div = document.createElement("div");
            div.id = "liveplayer_"+i;
            div.innerHTML = "<live-player video-url='"+players[i]+"' live='false' aspect='16:9'></live-player>";
            liveplayers.appendChild(div);
        }
    </script>
    </body>
</html>