Browse Source

弹幕

pull/19/head
zyronon 4 years ago
parent
commit
7b849f62be
  1. 2
      public/index.html
  2. 53
      src/pages/home/LivePage.vue

2
public/index.html

@ -41,6 +41,8 @@ @@ -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>

53
src/pages/home/LivePage.vue

@ -85,6 +85,7 @@ @@ -85,6 +85,7 @@
</div>
</div>
</div>
<div id="danmu"></div>
</div>
</template>
@ -111,20 +112,44 @@ export default { @@ -111,20 +112,44 @@ export default {
},
mounted() {
nextTick(() => {
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)
$("#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
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: {

Loading…
Cancel
Save