食用Dplayer方法

August 12, 2019 · · 97次阅读

说明

  弹幕API:https://dplayer.moerats.com 源自Rat's大佬
  Dplayer的GitHub
  详细教程和播放器的参数

开始

  1.首先在head引入js和CSS

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/MoePlayer/DPlayer@v1.25./dist/DPlayer.min.css">
<script src="https://cdn.jsdelivr.net/gh/MoePlayer/DPlayer@v1.25.0/dist/DPlayer.min.js"></script>

2.HTML代码

<div id="dplayer"></div>

3.JS配置播放器的参数

<script language="JavaScript" type="text/javascript">
    const dp = new DPlayer({
    container: document.getElementById('dplayer'),
    screenshot: true,/*开启截图功能,不需要就删除*/
    video: {
        url: '这里填视频的地址,xxx.mp4',
        pic: '这里填视频封面的地址',
},
    danmaku: {
        id: '弹幕池的id,自己随便写(?)',
        api: 'https://dplayer.moerats.com/',/*弹幕的API*/
        user: '弹幕者的名字,自己随便写(?)',
    },
});
</script>

后记

  不知道是什么原因,直接使用上面的代码是可以在首页播放的,但是跳转到其他页面再跳回首页,div就一片空白???最后还是用标签iframe直接引用视频所在的页面解决跳转空白的问题。然后问题又来了,视频无法全屏???在指南里给出了解决方法:iframe 上添加 allowfullscreen 属性。

标签:代码

添加新评论

CATEGORIES

控制面板