0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

是AI识图吗?为什么B站的弹幕可以不挡人物?

jf_ro2CN3Fa 来源:钱得乐 作者:钱得乐 2022-11-14 14:57 次阅读

那天在B站看视频的时候偶然发现当字幕遇到人物的时候就被裁切了,不会挡住人物,觉得很神奇,于是决定一探究竟。

高端的效果,往往只需要采用最朴素的实现方式,忙碌了两个小时,陈师傅打开了F12,豁然开朗。一张图片+一个属性,直接搞定。

49df5c82-6300-11ed-8abf-dac502259ad0.jpg

49fe20e0-6300-11ed-8abf-dac502259ad0.jpg

为了印证我的想法,我决定自己写一个demo





<a href="https://www.elecfans.com/tags/ti/" target="_blank"><u>Ti</u></a>tle




元芳,你怎么看
你难道就是传说中的奶灵
你好,我是胖灵
这是第一集,还没有舔灵

效果是这样的

4a21aa88-6300-11ed-8abf-dac502259ad0.jpg

加一个红背景,看的清楚一些

4a3f1384-6300-11ed-8abf-dac502259ad0.jpg

至此我们就实现了B站同款的不遮挡人物的弹幕。至于这张图片是怎么来的,肯定是AI识别出来然后生成的,一张图片也就一两K,一次加载很多张也不会造成很大的负担。

最后来看看这个神奇的css属性吧

developer.mozilla.org/zh-CN/docs/…

Experimental: 这是一个实验中的功能

所以在开发需求的时候可以把它当成一个亮点使用,但是不能强依赖于这个属性做需求。

它还有一系列的属性,有兴趣的话可以挨个试一下。

4a5bdbc2-6300-11ed-8abf-dac502259ad0.jpg

原作者:稀土掘金钱得乐 在此特别鸣谢!

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • AI
    AI
    +关注

    关注

    87

    文章

    27436

    浏览量

    265117
  • CSS
    CSS
    +关注

    关注

    0

    文章

    107

    浏览量

    14220

原文标题:为什么 B 站的弹幕可以不挡人物?

文章出处:【微信号:芋道源码,微信公众号:芋道源码】欢迎添加关注!文章转载请注明出处。

收藏 人收藏

    评论

    相关推荐

    esp32当modbus-rtu slave从通讯,主收不到从的响应报文是哪里的问题?

    情况 但是从esp32的日志打印来看,从这边确实是可以收到主的请求报文的,但是主就是收不到从的响应报文,也没看到esp32有什么报
    发表于 06-17 07:39

    抖音严打不当虚拟人物AI生成行为,优化平台生态环境

    据悉,去年8月抖音发布了《人工智能生成内容的平台规范及行业倡议》,强调禁止利用AI技术制作虚拟人物进行低质量创作。今年3月27日,抖音安全中心又发布公告表示,发现少数账号依然存在使用AI技术生成虚拟
    的头像 发表于 03-27 14:54 258次阅读

    主板用STM32H7B3I-DK然后配一个普通的摄像头,可以实现视觉AI吗?

    主板用STM32H7B3I-DK然后配一个普通的摄像头,可以实现视觉AI
    发表于 03-19 06:44

    STM32H750可以使用Cube.AI吗?

    STM32H750,可以使用Cube.AI
    发表于 03-19 06:14

    AI克隆技术可用于创建虚拟人物形象!它的技术原理和发展趋势

    电子发烧友网报道(文/李弯弯)AI克隆技术主要指的是人工智能技术用于复制或克隆人类的行为、声音、形象等方面的技术。这种技术可以用于生成虚拟人物、虚拟角色、虚拟明星等,以及为其创建独特的语音、外观
    的头像 发表于 01-08 08:28 1869次阅读
    <b class='flag-5'>AI</b>克隆技术可用于创建虚拟<b class='flag-5'>人物</b>形象!它的技术原理和发展趋势

    AI大模型可以取代大学教育吗?

    AI大模型
    电子发烧友网官方
    发布于 :2024年01月02日 16:27:52

    AI大模型可以设计电路吗?

    AI大模型
    电子发烧友网官方
    发布于 :2024年01月02日 15:09:29

    9天练会电子电路识图

    电子发烧友网站提供《9天练会电子电路识图.zip》资料免费下载
    发表于 10-20 11:00 34次下载
    9天练会电子电路<b class='flag-5'>识图</b>

    【KV260视觉入门套件试用体验】Vitis AI 构建开发环境,并使用inspector检查模型

    (\'inspect/inspect_DPUCZDX8G_ISA1_B4096.png\') 总结: Xilinx使用docker分发Vitis AI,这让开发者可以非常方便地构建Vitis
    发表于 10-14 15:34

    《电子工程师必备——九大系统电路识图宝典》+附录5学习方法

    感谢提供的试读机会。 谢谢胡斌 谢谢胡松 谢谢人民邮电出版社 谢谢中国工信出版集团 谢谢电子发烧友论坛 试读 胡斌 胡松编著的《电子工程师必备 九大系统电路识图宝典第2版》! 接上三篇: 《电子
    发表于 10-06 23:25

    《时代》评全球百大AI人物:李彦宏、李开复、吴恩达、黄仁勋、李飞飞等人上榜

    来源:大数据文摘 编辑:感知芯视界 刚刚!《时代》杂志公布了全球 AI 领域最具影响力的100位人物。 这份名单包括领导者、创新者、塑造者、思想家等四个板块,其中百度掌舵人李彦宏入选“领导者
    的头像 发表于 09-11 12:31 335次阅读

    【KV260视觉入门套件试用体验】部署vitis-ai环境以及测试demo

    /ug1354-xilinx-ai-sdk/%E4%B8%8B%E8%BD%BD-Vitis-AI-Library 在安装->设置目标->步骤1:安装开发板镜像 开始下载镜
    发表于 08-27 23:35

    如何利用大模型构建知识图谱?如何利用大模型操作结构化数据?

    上图是之前,我基于大语言模型构建知识图谱的成品图,主要是将金融相关的股票、人物、涨跌幅之类的基金信息抽取出来。
    的头像 发表于 08-24 16:56 1.1w次阅读
    如何利用大模型构建知<b class='flag-5'>识图</b>谱?如何利用大模型操作结构化数据?

    请问STM32H7B3I-DK可以实现AI吗?

    主板用STM32H7B3I-DK然后配一个普通的摄像头,可以实现视觉AI
    发表于 08-08 08:09