如何用css3做弹幕

html-css06

如何用css3做弹幕,第1张

1.首先创建弹幕区域

<div class="barrage"><div class="mask"><!--//弹幕内容--></div></div><input type="text" ng-model="data.comment"/><button ng-click="addDanmu()">说两句</button >

2.css

.webPage .barrage{width:100%height:22%position: absolutebottom: 50pxbackground-color: transparentpointer-events: none}.webPage .barrage .mask{width:100%height:100%background:transparentz-index:100}

因为涉及到自媒体版权与软件编码等因素

[解析]

「danmu.xml」这个文件不用说了吧?就是这个视频的“弹幕文件”

「entry.json」可以简单的认为是“标识文件”(即保存了视频标题)

——————

再来看「80」这个多媒体文件夹

「audio.m4s」保存了该视频的“音轨”(即音频信号)

「index.json」保存了该视频具体参数与合并的一些相关参数

「vido.m4s」保存了该视频的“影像”(即画面信号)

这种通过文件拆分的保存方式对于防止被盗用是十分有效的

[小提示]

虽然是比较另类的媒体格式不过依旧可以通过一些播放软件正常打开浏览