DevGox ~ 新冢狐

HTML5网页视频播放器在线源码(Dplayer+Plyr)

Dplayer

Dplayer

Dplayer代码

<head>
  <title>Dplayer</title>
  <meta charset="UTF-8">
  <link rel=stylesheet type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/dplayer/1.22.2/DPlayer.min.css"></link>
  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/dplayer/1.22.2/DPlayer.min.js"></script>
</head>
<body>
  <div id="dplayer"></div>
  <script>
    const dp = new DPlayer({
      container: document.getElementById('dplayer'),
      video: {
        url: 'http://t.cn/A6hvsb8v',
        type: 'auto'
      },
    });
  </script>
</body>

Plyr

Plyr代码

<html>
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/plyr/3.1.0/plyr.css" />
</head>
<body>
  <script src="//cdnjs.cloudflare.com/ajax/libs/plyr/3.1.0/plyr.min.js"></script>
  <video id="player" controls>
  </video>
</body>
<script type="text/javascript">
  const player = new Plyr('#player');
  player.source = {
    type: 'video',
    title: 'Elephant Dream',
    sources: [{
      src: 'http://t.cn/A6hvsb8v',
      type: 'video/mp4',
    }]
  };
</script>
</html>

当前页面是本站的「Google AMP」版。查看和发表评论请点击:完整版 »