Skip to content

[软技能] 第124天 你有开发过弹幕吗?知道它的原理吗?说说看 #1081

Open
@haizhilin2013

Description

@haizhilin2013

第124天 你有开发过弹幕吗?知道它的原理吗?说说看

Activity

csuZipple

csuZipple commented on Aug 18, 2019

@csuZipple

没有开发过,如果要我来开发的话我会这样做:

  • 在video上方设置一个弹幕container,设置相对定位。子元素都是绝对定位并设置z-index。
  • 生成一个dom将弹幕内容填充进去,在container中append
  • 设置dom的animation动画,从右到左划过整个video
  • 将带有时间戳信息的弹幕内容通过规定好的格式发送给后端

PS:

  • 顺序可以调换,一般是确定后台接收到数据了再生成dom
  • 没了解过如何实现弹幕防挡。
fanyifanbumaimeng

fanyifanbumaimeng commented on Aug 28, 2019

@fanyifanbumaimeng

补充一点,弹幕出屏幕之后要销毁。

没有开发过,如果要我来开发的话我会这样做:

  • 在video上方设置一个弹幕container,设置相对定位。子元素都是绝对定位并设置z-index。
  • 生成一个dom将弹幕内容填充进去,在container中append
  • 设置dom的animation动画,从右到左划过整个video
  • 将带有时间戳信息的弹幕内容通过规定好的格式发送给后端

PS:

  • 顺序可以调换,一般是确定后台接收到数据了再生成dom
  • 没了解过如何实现弹幕防挡。

补充一点,弹幕出屏幕之后要销毁。

tao7544

tao7544 commented on Sep 29, 2019

@tao7544

@csuZipple 似乎移动端浏览器 视频会处于层级最高状态。弹幕实现不了。。未来好像有弹幕标签

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @haizhilin2013@fanyifanbumaimeng@csuZipple@tao7544

        Issue actions

          [软技能] 第124天 你有开发过弹幕吗?知道它的原理吗?说说看 · Issue #1081 · haizlin/fe-interview