表情包跑酷

by PhantomFlame39
97 lines3.8 KB
https://arcadelab.ai/play/game-phantomflame39明白啦！手机APP版本的豆包，加号菜单里没有代码画布入口，这个功能在手机APP上是没有的，网页版豆包才有这个代码预览画布。
 
两个办法
 
方案1（推荐，能生成那种aka.doubaocdn的游玩链接）
 
1. 手机浏览器打开豆包网页版： doubao.com 
2. 在网页版对话框发：调出代码画布
3. 画布就会弹出来，粘贴跑酷代码，运行，就能生成分享链接
 
方案2（不用网页，直接本地玩）
 
我把完整的表情包跑酷全部代码一次性完整发给你，你复制全部代码：
 
1. 手机浏览器，打开任意一个「HTML在线运行网站」（比如htmlpreview）
2. 粘贴代码，点运行，直接在浏览器玩游戏。
 
下面是完整无截断的游戏代码，全部复制：
 
html
  
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<title>表情包跑酷</title>
<style>
*{margin:0;padding:0;box-sizing:border-box}
html,body{width:100%;height:100%;overflow:hidden;background:#2b3040;font-family:system-ui}
#game{touch-action:none;}

.title-shadow-group {
  position: relative;
  display: inline-block;
}
.title-shadow-group .shadow-emoji {
  position: absolute;
  font-size: 0.45em;
  filter: blur(0.6px);
  opacity: 0.55;
  animation: floatShadow 3.2s ease-in-out infinite;
  pointer-events: none;
}
.title-shadow-group .s1 { right: -18%; top: 12%; animation-delay: 0s; }
.title-shadow-group .s2 { right: -34%; top: 4%; animation-delay: 0.4s; }
.title-shadow-group .s3 { right: -50%; top: 18%; animation-delay: 0.8s; }
.title-shadow-group .s4 { right: -66%; top: 6%; animation-delay: 1.2s; }
.title-shadow-group .l1 { left: -18%; top: 12%; animation-delay: 0.6s; }
.title-shadow-group .l2 { left: -34%; top: 4%; animation-delay: 1.0s; }
.title-shadow-group .l3 { left: -50%; top: 18%; animation-delay: 1.4s; }
.title-shadow-group .l4 { left: -66%; top: 6%; animation-delay: 0.2s; }

@keyframes floatShadow {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-6px) scale(1.08); }
}

#menu{position:fixed;inset:0;background:#2c3244;z-index:100;
display:flex;flex-direction:column;align-items:center;justify-content:center;
text-align:center;gap:14px;
transition: filter 0.25s ease;
}
#menu.dimmed{
  filter: brightness(0.4);
}
#menuTitle{font-size:5vh;font-weight:900;color:#ffd166;letter-spacing:2px;text-shadow:0 4px 18px rgba(255,209,102,0.45)}
#menuEmoji{font-size:14vh;line-height:1}
#menuCoin{font-size:20px;color:#ffd166;margin-top:4px}
.btn{padding:12px 36px;font-size:20px;border:none;border-radius:12px;margin:6px;background:#4285f4;color:#fff}
.btn:disabled{background:#555;color:#aaa;cursor:not-allowed}

#giftPop{position:fixed;inset:0;background:rgba(0,0,0,0.85);z-index:300;display:none;align-items:center;justify-content:center;color:white;text-align:center}
.giftBox{background:#383e54;padding:3vh;border-radius:16px;width:86vw;max-width:560px}
.giftTitle{font-size:3.6vh;margin-bottom:1.8vh;color:#ffd166}
.giftText{font-size:2.3vh;margin-bottom:2.6vh}
.giftBtnGroup{display:flex;gap:2vh;justify-content:center}
.giftBtnYes{background:#27ae60}
.giftBtnNo{background:#777}

#game{
  position:absolute;
  inset:0;
  display:none;
  overflow:hidden;
  background:linear-gradient(#444c66,#282d3b);
}
.ground{position:absolute;left:0;right:0;bottom:0;height:110px;background:#4a5064;border-top:3px solid #636a80}
.highway{
  position:absolute;left:0;right:0;bottom:230px;height:12px;
  background:#636a80;
  border:2px solid #ffd166;
  box-shadow:0 0 12px rgba(255,209,102,0.35);
  display:none;
}
#player{position:absolute;left:100px;bottom:110px;font-size:44px;z-index:10;transition:none}
.obstacle{position:absolute;z-index:8;bottom:110px
Game Source: 表情包跑酷

Creator: PhantomFlame39
Libraries: none
Complexity: moderate (97 lines, 3.8 KB)
The full source code is displayed above on this page.
Remix Instructions

To remix this game, copy the source code above and modify it. Add a ARCADELAB header at the top with "remix_of: game-phantomflame39" to link back to the original. Then publish at arcadelab.ai/publish.