https://github.com/sbdavid/ppbarrage
https://github.com/sbdavid/ppbarrage
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/sbdavid/ppbarrage
- Owner: SBDavid
- Created: 2017-07-24T10:13:28.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2017-08-18T08:29:08.000Z (almost 8 years ago)
- Last Synced: 2025-02-21T05:17:33.669Z (4 months ago)
- Language: JavaScript
- Size: 18.6 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# 高性能canvas弹幕
支持同时显示200条弹幕，并维持60fps帧率
## 特征
- 弹幕优先显示在顶部
- 弹幕永远不会重叠
- 支持缓冲池，如果屏幕已满则推后显示
- 支持配置弹幕滑动时长，字数多的弹幕移动更快
- 支持弹幕字体大小配置
- 支持弹幕轨道高度配置
`note: 依赖jquery和tween.js`
## Compatibility
| Browser | Support |
| ------------- |:----------------:|
| IE 9 | √ |
| IE 10 | √ |
| IE 11 | √ |
| chrome 59 | √ |
| FF 54 | √ |
## API
| fun | paramName | comment |
| ------------- |:-------------:| -----:|
| ppParrage | root：canvas节点 | 构造方法|
| init | config：配置项 | 初始化方法 |
| load | bullets：弹幕数据 | 加载弹幕数据 |
| start | 无 | 开始运行 |
| getStatus | 无 | 弹幕执行状态：init，running，idle |
## Usage
- be sure that the jquery and tween.js is loaded
## Simple
HTML
```html
window.onload = function () {
var test = new ppParrage.ppParrage(document.getElementById('pg'));
$('#init').click(function () {
test.init({
bulletHeight: 50,
displayTime: 6000, // 弹幕显示的时长
isDebug: false,
fontSize: 28 // 弹幕字体大小
});
})
$('#start').click(function () { test.start(); })
$('#load').click(function () {
test.load([
{ msg: '我是一条弹幕' },
])
})
$('#status').click(function () {
$('#status').text(test.getStatus());
})
$('#clarnAll').click(function () {
test.clarnAll();
})
}
init
load
start
clarnAll
status