實現(xiàn)彈幕很難嗎？

【公眾號回復 “1024”，免費領取程序員賺錢實操經(jīng)驗】

今天推薦的這個項目是 rc-bullets。

該項目基于 CSS3 Animation，使用 React 構建，可擴展，高性能。

它有如下特性：

• 支持傳入 React 組件，靈活控制彈幕內容和 UI，并提供一個默認樣式組件：

• 彈幕屏幕管理：清屏，暫停，隱藏（后續(xù)可能會加入針對單個彈幕的控制）

• 彈幕動畫參數(shù)化：運動函數(shù)（勻速/ease/步進/cubic-bezier）、時長（秒）、循環(huán)次數(shù)、延遲等

• 鼠標懸浮彈幕暫停

常用 API：

• 初始化彈幕屏幕：

const screen = new BulletScreen(
    
     |
     
      ,[
      ])
     
    

此處的option和下面的一致，偏向全局初始化，沒有則使用默認值，每次發(fā)送彈幕不傳則使用默認或全局設置，傳了則該條彈幕覆蓋全局設置。

• 發(fā)送彈幕：

const bulletId = screen.push(
    
     |
     
      ,[
      ])
     
    

看一下效果：

點擊閱讀原文，查看更多更詳細內容。

開源項目地址： https://github.com/zerosoul/rc-bullets

開源項目作者：Tristan Yang

推薦閱讀：

這位同學，通過這個開源項目，竟然拿到了字節(jié)跳動的 offer ！

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

騰訊開源又一力作，剛開源，標星已超 3.3k

今天的推薦不知道大家喜歡嗎？如果你喜歡，請在文章底部留言和點贊，以表示對我的支持，你們的留言、點贊和轉發(fā)關注是我持續(xù)更新的動力哦！

「GitHub精選」開始接受大家投稿啦

「GitHub精選」，每晚10:24準時為您推送