MoeJue/douyin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

弹幕

Browse Source
This commit is contained in:
zyronon 2021-09-24 00:03:22 +08:00
parent f905a3521b
commit 7b849f62be
2 changed files with 40 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/index.html
View File

@ -41,6 +41,8 @@
<script crossorigin="anonymous"
integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ=="
src="https://lib.baomitu.com/jquery/3.6.0/jquery.min.js"></script>
<script src="./jquery.danmu.min.js"></script>
</head>
<body>
<noscript>

51
src/pages/home/LivePage.vue
View File

@ -85,6 +85,7 @@
</div>
</div>
</div>
<div id="danmu"></div>
</div>
</template>
@ -111,20 +112,44 @@ export default {
},
mounted() {
nextTick(() => {
$("#danmu").danmu({
height: 360, //弹幕区高度
width: 300, //弹幕区宽度
zindex :100, //弹幕区域z-index属性
speed:7000, //滚动弹幕的默认速度，这是数值值得是弹幕滚过每672像素所需要的时间（毫秒）
sumTime:65535, //弹幕流的总时间
danmuLoop:false, //是否循环播放弹幕
defaultFontColor:"#FFFFFF", //弹幕的默认颜色
fontSizeSmall:16, //小弹幕的字号大小
FontSizeBig:24, //大弹幕的字号大小
opacity:"0.9", //默认弹幕透明度
topBottonDanmuTime:6000, // 顶部底部弹幕持续时间（毫秒）
SubtitleProtection:false, //是否字幕保护
positionOptimize:false, //是否位置优化，位置优化是指像AB站那样弹幕主要漂浮于区域上半部分
let page = new Dom('.LivePage')
console.log(page)
setInterval(() => {
let template = `<div class="barrage">
<div class="type">管理</div>
<div class="text">感谢老铁送的火箭</div>
</div>`
let barrage = new Dom().create(template)
console.log(barrage)
page.append(barrage)
}, 1000)
maxCountInScreen: 40, //屏幕上的最大的显示弹幕数目,弹幕数量过多时,优先加载最新的。
maxCountPerSec: 10 //每分秒钟最多的弹幕数目,弹幕数量过多时,优先加载最新的。
});
$("#danmu").danmu("addDanmu",[
{ text:"这是滚动弹幕" ,color:"white",size:1,position:0,time:2}
,{ text:"这是顶部弹幕" ,color:"yellow" ,size:1,position:1,time:3}
,{ text:"这是底部弹幕" , color:"red" ,size:1,position:2,time:3}
])
$('#danmu').danmu('danmuStart');
//
// let page = new Dom('.LivePage')
// console.log(page)
//
// setInterval(() => {
//
// let template = `<div class="barrage">
// <div class="type">管理</div>
// <div class="text">感谢老铁送的火箭</div>
// </div>`
// let barrage = new Dom().create(template)
// console.log(barrage)
// page.append(barrage)
// }, 1000)
})
},
methods: {