html5实现视频播放器 弹幕效果,基于HTML5的有弹幕功能的视频播放器

如何使用

Danmmu Player需要依赖jQuery，因此首先需要加入相关css和js文件。

接下来，在body中需要放置播放器的位置加入如下代码：

最后，关键的部分，配置参数，调用插件。

$("#danmup").DanmuPlayer({

src: "abc.mp4", //视频源

height: "480px", //区域的高度

width: "800px", //区域的宽度

urlToGetDanmu:"getData.php", //从后端获取弹幕数据

urlToPostDanmu:"sendData.php" //发送弹幕数据给后端保存入库

});

好了，现在可以运行你的弹幕播放器了，当然，如果不用与后端交互，则可以不使用urlToGetDanmu和urlToPostDanmu两个参数，直接在页面中加入初始数据，如：

$("#danmup .danmu-div").danmu("addDanmu",[

{ "text":"这是滚动弹幕" ,color:"white",size:1,position:0,time:2},

{ "text":"我是帽子绿" ,color:"green",size:1,position:0,time:3},

{ "text":"哈哈哈啊哈" ,color:"#f30",size:1,position:0,time:10},