【火爆全网的抖音无人直播项目:挤地铁源代码】

2024-05-26 18:18

本文主要是介绍【火爆全网的抖音无人直播项目:挤地铁源代码】,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

最近抖音上元宇宙虚拟项目挤地铁,直播游戏,用户进入直播间可以发送弹幕互动,模拟真实挤地铁场景,可能因为疫情大家憋在家无聊,直播间人数有5000多人,抖音一直不鼓励无人直播,没想到在抖音做挤地铁直播居然没有被限流。

微信:data5u

提供源码:https://download.csdn.net/download/u010978757/85178184?spm=1001.2014.3001.5503
猜成语项目:https://blog.csdn.net/u010978757/article/details/124658753
猜歌名项目:https://blog.csdn.net/u010978757/article/details/124659147?spm=1001.2014.3001.5502

原文链接:https://code.data5u.com/code/detail-607.html

类似的弹幕互动游戏除了挤地铁模拟器以外还有模拟广场舞和舞厅蹦迪的,甚至还有冲马桶的。

如果只是想要体验游玩抖音挤地铁的话,找一个正在进行这种直播的直播间加入就可以了,发送弹幕即可参与。

而如果是想要自己当主播,在自己的直播间里开启这种挤地铁的互动小游戏的话,目前抖音还没有提供官方内置的模式,需要用户自己准备相应的软件挂在后台上运行。

在这里插入图片描述

<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title><script type="text/javascript" src="plugin/anime/lib/anime.min.js"></script><script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script><style>.info:before {content: "";position: absolute;bottom: -10px;left: 95px;border-left: 5px solid transparent;border-top: 10px solid red;border-right: 5px solid transparent;}</style></head><body style="padding: 0; margin: 0; width: 100%; height: 100vh; overflow: hidden; height: 906px;"><div style="display: flex; flex-direction: row; height: 100vh; background-color: #c3c3c3; "><div style="width: calc(100% - 160px); height: 100%; background-color: red; display: flex; flex-direction: column; background-image: url(img/ground.png); border-right: 6px solid #9c7e46;" ><div style="width: 100%; height: 50%; display: none;"><button id="trainArr">来车了</button><button id="trainGo">开走了</button><button id="openDoor">开门</button><button id="closeDoor">关门</button><button id="personAdd">来个人</button><button id="personIn">进门</button><button id="personSay">说话</button></div><div id="stationIn" style="width: 100%; height: 50%;"></div></div><div style="overflow: hidden; width: 160px; height: 100%; background-image: url(img/guidao.png);"><div class="door" id="door1" style="position: absolute; top: 240px; z-index: 9;"><div class="doorLeft" style="position: relative; width: 5px; height: 50px; background-color: #9c7e46;"></div><div class="doorRight" style="position: relative; width: 5px; height: 50px; background-color: #9c7e46;"></div></div><div class="door" id="door2" style="position: absolute; top: calc(50% + 120px); z-index: 9;"><div class="doorLeft" style="position: relative; width: 5px; height: 50px; background-color: #9c7e46;"></div><div class="doorRight" style="position: relative; width: 5px; height: 50px; background-color: #9c7e46;"></div></div>				<div class="bag" id="bag1" style="width: 100%; height: 330px; position: absolute; top: 170px;"></div><div class="bag" id="bag2" style="width: 100%; height: 330px; position: absolute; top: calc(50% + 70px); "></div><div class="train" style="width: 160px; height: 1140px; background-image: url(img/train.png); position: absolute; top: 100%;"></div></div></div><div style="display: none;" id="model"><div class="aPersonModel" style="position: absolute; text-align: center; align-items: center; display: flex; flex-direction: column; flex-wrap: wrap; z-index: 999;"><p class="info" style="display: none; background-color: #FFFFFF; font-size: 12px; width: 200px; border: 1px solid #000000; overflow-wrap: normal; position: absolute; top: -60px; z-index: -1;"></p><img class="headimg" style="width: 60px; height: 60px; border-radius: 60px; z-index: 9; border: 1px solid #000;" src="plugin/anime/documentation/assets/img/animejs-v3-header-animation.gif" /></div></div><div class="infos"><div onclick="window.open('http://www.kuwo.cn/search/list?key=DJ')" style="display: none; position: absolute; top: 150px;left: 50px; right: 200px; background-color: #00000055; color: #FFFFFF; padding: 6px 12px;"><marquee>欢迎 <font id="newUserName">啦啦啦</font> 来挤地铁</marquee></div><div onclick="window.open('http://www.kuwo.cn/search/list?key=DJ')" style="display: none; position: absolute; top: 200px;left: 50px; right: 200px; background-color: #00000055; color: #FFFFFF; padding: 6px 12px;"><marquee >评论区发送口令:电话, 发火, 拥挤, 运动, 小鸡, 变身, 1, 2, 3, 4, 5, 6</marquee></div><div style="position: absolute; right: 180px; background-color: #00D672; color: #FFFFFF; padding: 0 4px; line-height: 10px; top: 230px; text-shadow: .1rem .2rem .2rem #000000; "><p></p><p></p><p></p><p></p></div><div style="position: absolute; right: 180px; background-color: #00D672; color: #FFFFFF; padding: 0 4px; line-height: 10px; top: 570px;  text-shadow: .1rem .2rem .2rem #000000;"><p></p><p></p><p></p><p></p></div><div style="display: none; font-size: 100px; line-height: 20px; text-align: center; position: absolute; top: 170px; left: calc( (100% - 170px - 120px)/2 ); font-weight: bold; opacity: 0.1;"><p></p><p></p><p></p></div><div style="display: none; font-size: 30px; line-height: 20px; text-align: center; position: absolute; top: 140px; left: calc( (100% - 170px - 120px)/2 + 120px ); font-weight: bold; opacity: 0.1; color: #FF0000;"><p></p><p></p><p></p><p></p><p></p><p></p><p></p><p></p><p></p><p></p></div><div id="stationInfo" style="text-align: center; font-size: 13px; width: 140px; position: absolute; right: 8px; top: 400px; background-color: #00D672; color: #FFFFFF; padding: 0 4px; line-height: 10px;  text-shadow: .1rem .2rem .2rem #000000;"><p style="display: none;">当前车站:<font id="currStation">西直门</font></p><p style="display: none;">下一车站:<font id="nextStation">大钟寺</font></p><p><svg t="1650691476609" class="icon" viewBox="0 0 1055 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1650" width="32" height="32"><path d="M219.508059 593.933479h600.814167s-23.510324 70.530972-62.694197 70.530972H229.946643l-10.438584-70.530972zM222.109868 348.391655h130.62336v143.663753zM459.830591 356.22843h143.679427l151.500528 122.770912h-148.898719z" fill="#d4237a" p-id="1651"></path><path d="M751.421303 677.536192H224.727351a15.673549 15.673549 0 0 1-15.67355-15.67355V277.89203a15.673549 15.673549 0 0 1 31.347099 0v368.297063h511.020403c22.115378 0 41.5976-12.726922 53.446803-34.920668 14.451013-27.06822 13.353864-60.546921-2.664503-85.938071L576.002939 338.580013a15.01526 15.01526 0 0 1-1.285231-1.175516c-27.397364-28.275083-62.584483-43.838918-99.072506-43.838918H300.493288a15.673549 15.673549 0 0 1 0-31.347098h175.151914c44.763657 0 87.693509 18.714218 120.968454 52.741493l227.407528 187.722101c1.175516 0.97176 2.194297 2.100256 3.040668 3.354139 23.49465 35.093077 25.641927 82.192093 5.470069 119.981021-17.209557 32.256165-47.537875 51.518957-81.110618 51.518957z" fill="#d4237a" p-id="1652"></path><path d="M781.138353 507.117689h-325.226149a15.673549 15.673549 0 0 1-15.67355-15.673549v-141.061944a15.673549 15.673549 0 0 1 15.67355-15.67355h69.230067a15.673549 15.673549 0 0 1 0 31.347099h-53.556518v109.714846h309.5526a15.673549 15.673549 0 0 1 0 31.347098zM353.673641 507.117689H236.357124a15.673549 15.673549 0 0 1 0-31.347098h101.642968v-109.714846H236.357124a15.673549 15.673549 0 0 1 0-31.347099h117.316517a15.673549 15.673549 0 0 1 15.67355 15.67355v141.061944a15.673549 15.673549 0 0 1-15.67355 15.673549zM305.71258 612.898474h-80.985229a15.673549 15.673549 0 0 1 0-31.347099h80.985229a15.673549 15.673549 0 0 1 0 31.347099zM404.973168 612.898474h-36.56639a15.673549 15.673549 0 0 1 0-31.347099h36.56639a15.673549 15.673549 0 0 1 0 31.347099zM827.014832 612.898474H467.667366a15.673549 15.673549 0 0 1 0-31.347099h359.347466a15.673549 15.673549 0 0 1 0 31.347099zM765.464803 761.781519h-536.819065a15.673549 15.673549 0 0 1 0-31.347098h536.819065a15.673549 15.673549 0 0 1 0 31.347098z" fill="#d4237a" p-id="1653"></path></svg><span style="position: relative; top: -13px;">候车时间:<font id="leftArrTime">00:15</font></span></p></div><div style="text-align: center;  position: absolute; bottom: 6px; color: #ffffff; font-weight: bold; left: calc( 50% - 180px ); background-color: #0000003b; padding: 0 20px; font-weight: bold;"><p id="currTime">2022-04-04 12:33:00</p><p id="currDay">星期三</p></div><audio id="audio"></audio><audio src="video/zaoyin.mp3" id="audioZaoYin" autoplay loop></audio><audio src="video/yiqing.wav" id="audioYiQing"></audio></div><script type="text/javascript" src="js/util.js"></script><script type="text/javascript" src="js/train-v2.js"></script><script type="text/javascript" src="js/control.js"></script></body>
</html>

这篇关于【火爆全网的抖音无人直播项目:挤地铁源代码】的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1005221

相关文章

SpringBoot项目启动错误:找不到或无法加载主类的几种解决方法

《SpringBoot项目启动错误:找不到或无法加载主类的几种解决方法》本文主要介绍了SpringBoot项目启动错误:找不到或无法加载主类的几种解决方法,具有一定的参考价值,感兴趣的可以了解一下... 目录方法1:更改IDE配置方法2:在Eclipse中清理项目方法3:使用Maven命令行在开发Sprin

Nginx实现高并发的项目实践

《Nginx实现高并发的项目实践》本文主要介绍了Nginx实现高并发的项目实践,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧... 目录使用最新稳定版本的Nginx合理配置工作进程(workers)配置工作进程连接数(worker_co

Java对象和JSON字符串之间的转换方法(全网最清晰)

《Java对象和JSON字符串之间的转换方法(全网最清晰)》:本文主要介绍如何在Java中使用Jackson库将对象转换为JSON字符串,并提供了一个简单的工具类示例,该工具类支持基本的转换功能,... 目录前言1. 引入 Jackson 依赖2. 创建 jsON 工具类3. 使用示例转换 Java 对象为

Vue项目的甘特图组件之dhtmlx-gantt使用教程和实现效果展示(推荐)

《Vue项目的甘特图组件之dhtmlx-gantt使用教程和实现效果展示(推荐)》文章介绍了如何使用dhtmlx-gantt组件来实现公司的甘特图需求,并提供了一个简单的Vue组件示例,文章还分享了一... 目录一、首先 npm 安装插件二、创建一个vue组件三、业务页面内 引用自定义组件:四、dhtmlx

SpringBoot项目注入 traceId 追踪整个请求的日志链路(过程详解)

《SpringBoot项目注入traceId追踪整个请求的日志链路(过程详解)》本文介绍了如何在单体SpringBoot项目中通过手动实现过滤器或拦截器来注入traceId,以追踪整个请求的日志链... SpringBoot项目注入 traceId 来追踪整个请求的日志链路,有了 traceId, 我们在排

部署Vue项目到服务器后404错误的原因及解决方案

《部署Vue项目到服务器后404错误的原因及解决方案》文章介绍了Vue项目部署步骤以及404错误的解决方案,部署步骤包括构建项目、上传文件、配置Web服务器、重启Nginx和访问域名,404错误通常是... 目录一、vue项目部署步骤二、404错误原因及解决方案错误场景原因分析解决方案一、Vue项目部署步骤

golang内存对齐的项目实践

《golang内存对齐的项目实践》本文主要介绍了golang内存对齐的项目实践,内存对齐不仅有助于提高内存访问效率,还确保了与硬件接口的兼容性,是Go语言编程中不可忽视的重要优化手段,下面就来介绍一下... 目录一、结构体中的字段顺序与内存对齐二、内存对齐的原理与规则三、调整结构体字段顺序优化内存对齐四、内

配置springboot项目动静分离打包分离lib方式

《配置springboot项目动静分离打包分离lib方式》本文介绍了如何将SpringBoot工程中的静态资源和配置文件分离出来,以减少jar包大小,方便修改配置文件,通过在jar包同级目录创建co... 目录前言1、分离配置文件原理2、pom文件配置3、使用package命令打包4、总结前言默认情况下,

python实现简易SSL的项目实践

《python实现简易SSL的项目实践》本文主要介绍了python实现简易SSL的项目实践,包括CA.py、server.py和client.py三个模块,文中通过示例代码介绍的非常详细,对大家的学习... 目录运行环境运行前准备程序实现与流程说明运行截图代码CA.pyclient.pyserver.py参

nginx-rtmp-module构建流媒体直播服务器实战指南

《nginx-rtmp-module构建流媒体直播服务器实战指南》本文主要介绍了nginx-rtmp-module构建流媒体直播服务器实战指南,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有... 目录1. RTMP协议介绍与应用RTMP协议的原理RTMP协议的应用RTMP与现代流媒体技术的关系2