实现弹幕很难吗?

共 865字,需浏览 2分钟

 ·

2020-10-16 17:30



【公众号回复 “1024”,免费领取程序员赚钱实操经验】



今天推荐的这个项目是 rc-bullets


该项目基于 CSS3 Animation,使用 React 构建,可扩展,高性能。


它有如下特性:



  • 支持传入 React 组件,灵活控制弹幕内容和 UI,并提供一个默认样式组件:


  • 弹幕屏幕管理:清屏,暂停,隐藏(后续可能会加入针对单个弹幕的控制)


  • 弹幕动画参数化:运动函数(匀速/ease/步进/cubic-bezier)、时长(秒)、循环次数、延迟等


  • 鼠标悬浮弹幕暂停



常用 API:



  • 初始化弹幕屏幕:



const screen = new BulletScreen(

|

,[



此处的option和下面的一致,偏向全局初始化,没有则使用默认值,每次发送弹幕不传则使用默认或全局设置,传了则该条弹幕覆盖全局设置。



  • 发送弹幕:



const bulletId = screen.push(

|

,[



看一下效果:



点击阅读原文,查看更多更详细内容。


开源项目地址: https://github.com/zerosoul/rc-bullets


开源项目作者:Tristan Yang


推荐阅读:


这位同学,通过这个开源项目,竟然拿到了字节跳动的 offer !


阿里出品的开源接口管理工具


腾讯开源又一力作,刚开源,标星已超 3.3k


今天的推荐不知道大家喜欢吗?如果你喜欢,请在文章底部留言和点赞,以表示对我的支持,你们的留言、点赞和转发关注是我持续更新的动力哦!


「GitHub精选」开始接受大家投稿啦


「GitHub精选」,每晚10:24准时为您推送






浏览 75
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报