🍉播放器设置方式（包括MP4和其他，其他请看网站的网址）

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name=viewport
          content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,minimal-ui">
    <meta name="referrer" content="no-referrer">
    <title>xgplayer</title>
    <style type="text/css">
      #mse{
        margin: 0 auto;

      }
      .container{
        width: 750px;
        height: auto;
        margin: 0 auto;

      }
    </style>
</head>
<body>
  <div class="container">
         <div id="mse" ></div>
  </div>


<script src="//unpkg.byted-static.com/xgplayer/2.31.6/browser/index.js" charset="utf-8"></script>
<script>
<!--  Mp4设置方式 如果想知道M3u8格式 请到下面地址 -->
// https://v2.h5player.bytedance.com/generate/

    let player = new Player({
        "id": "mse",
        "url": "https://lizst.glendonclass.com/media/videos/mp4/248297.mp4?st=VGvkR9Mz3yv0Ci5TzWNvzw&e=1738424844",
        // poster:"{{ data.v_cover }}",
        /*fitVideoSize: 'auto',*/
        "playsinline": true,
        "whitelist": [
            ""
        ],
        "autoplay": true,
        "fluid": true,
        el: document.querySelector('#mse'),
        playbackRate: [0.5, 0.75, 1, 1.5, 2],
        defaultPlaybackRate: 1.0,
        rotate: {   //视频旋转按钮配置项
            innerRotate: true, //只旋转内部video
            clockwise: false // 旋转方向是否为顺时针
        },
    });
    player.on('rotate', function (deg) {
        console.log(deg);// 旋转时会触发rotate事件，角度有四个值90，180，270，0
    })

</script>
</body>
</html>
posted on 2025-02-01 22:41 我爱你的阅读(38) 评论(0) 收藏举报