花了点时间做了个弹幕播放器的雏形,主要问题是弹幕部分还没做( • ˍ •ू )
本播放器完全基于HTML5,Javascript,CSS3制作。
以下是雏形(颜色奇怪的部分是未装修的部分,不要觉得奇怪啊喵)
视频和控制条中间那一块孔板区域是弹幕发送框预留位,我没给他色位标识是因为已经定了白色了。。。
隐藏了边栏以后
音量条
点击音量条下面的“张大的嘴”可静音
撑满页面效果
撑满页面模式下的弹幕发送框(全频模式下暂时一样)
全屏模式

全屏模式下 的控制状态
和BILI不同的地方就是全屏也可以打开边栏
进度条包括三部分:播放进度、播放过的时间条、缓冲条(虽然没什么必要不过目前用来装B)
按钮介绍
弹幕部分已做好了加载弹幕,在显示弹幕方面我一直在纠结是用canvas还是直接用HTML
目前想要在同一页面显示多个这样的播放器的话只能用iframe了,这是由我这蛋疼的代码习惯决定的….
本文发布于 https://luojia.me
本站文章未经文下加注授权不得拷贝发布。