关键词搜索
标签搜索
近期浏览
热门文章
侧边栏壁纸
博主昵称
_北海彡

神奇的JS——2048小游戏

2024年09月07日 595阅读 16评论 2点赞

　　又找到一个有意思的源码，纯JS能做出这样的小游戏，属实是有点6，和上一篇的主题是一样的，废话不多说，直接上源码。

效果图片

2048(1)

2048(2)

演示

http://http://lgnb.asia/bbx/2048/1.html

源代码

index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">

<head>
    <!--网站LoGo显示-->
    <link rel="shortcut icon" href="http://lgzgzs.top/bbx/img/7.png" type="image/x-icon">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <title>2048</title>
    <meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0, maximum-scale=1, user-scalable=no, minimal-ui">
    <link rel="stylesheet" href="1.css">
</head>

<body>
    <div class="container">
        <div class="heading">
            <h1 class="title">2048小游戏</h1>

            <div class="scores-container">
                <div class="score-container">
                    <div class="score-addition"></div>
                </div>
                <div class="best-container"></div>
            </div>
        </div>
        <div class="above-game">
            <a class="restart-button">新游戏</a>
        </div>
        <div class="game-container">
            <div class="game-message">
                <p>
                </p>
                <div class="lower">
                    <a class="keep-playing-button">继续前进</a>
                    <a class="retry-button">再试一次</a>
                    <div class="score-sharing"></div>
                </div>
            </div>
            <div class="grid-container">
                <div class="grid-row">
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                </div>
                <div class="grid-row">
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                </div>
                <div class="grid-row">
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                </div>
                <div class="grid-row">
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                    <div class="grid-cell">
                    </div>
                </div>
            </div>
            <div class="tile-container"></div>
        </div>


        <p> LGZ提示： ⬅➡⬆⬇滑动屏幕移动</p>
        <script src="p.js"></script>

        <div style="text-align:center;">
            <p><a href="" title="" target="_blank"></a></p>
        </div>
</body>

</html>

剩下两个文件过大就放底下下载了，如下.

1.css

p.js

当然也可以用本工作室的CDN形式来加载，如下.

<link rel="stylesheet" href="http://lgz.lgnb.asia/bbx/2048/1.css">
<script src="http://lgz.lgnb.asia/bbx/2048/p.js"></script>

就是以上这些了，喜欢点个赞，拿走吱一声呦~

2赞
打赏
源码分享JavaScript
发布作者： _北海彡
百度收录： 正在检测是否收录...
最后更新： 2025年 02月 12日 15:56
本文链接： https://lgnb.asia/index.php/archives/38/
作品采用： 《 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 》许可协议授权

—— 评论区 ——

昵称
邮箱
网址
取消
  1. 头像
    hiwzycrpw
    Windows XP   Internet Explorer
    回复

    神奇的JS——2048小游戏 - LGZ - 海云博客
    [url=http://www.gu8oo86a08re7n9a28e82m31r8v4uj3hs.org/]uhiwzycrpw[/url]
    ahiwzycrpw
    hiwzycrpw http://www.gu8oo86a08re7n9a28e82m31r8v4uj3hs.org/

  2. 头像
    bxcglzizf
    Windows XP   Internet Explorer
    回复

    神奇的JS——2048小游戏 - LGZ - 海云博客
    [url=http://www.gy27ite1ggd0g3d08786k3f18f97aa9os.org/]ubxcglzizf[/url]
    bxcglzizf http://www.gy27ite1ggd0g3d08786k3f18f97aa9os.org/
    abxcglzizf

  3. 头像
    fjihiezte
    Windows XP   Internet Explorer
    回复

    神奇的JS——2048小游戏 - LGZ - 海云博客
    afjihiezte
    fjihiezte http://www.g258547fv08i297nrmznutajx5i2v769s.org/
    [url=http://www.g258547fv08i297nrmznutajx5i2v769s.org/]ufjihiezte[/url]

  4. 头像
    hfiarkyjqh
    Windows 10 x64 Edition   搜狗高速浏览器
    回复

    段落衔接自然，过渡流畅，读来一气呵成。

  5. 头像
    zcskjbctik
    Windows 10 x64 Edition   搜狗高速浏览器
    回复

    立意高远，以小见大，引发读者对社会/人性的深层共鸣。

  6. 头像
    xspubhoswu
    Windows 10 x64 Edition   搜狗高速浏览器
    回复

    多语种文献的引用彰显学术包容性。

博主栏壁纸
博主头像 _北海彡

40 文章数
13 标签数
349 评论量
人生倒计时
最新评论
热门文章
  1. 1 PHP搭建QQ机器人(QQ官方)
    PHP搭建QQ机器人(QQ官方)
    1910 阅读 - 10/20
  2. 2 网易云免费音乐解析
    网易云免费音乐解析
    1413 阅读 - 10/20
  3. 3 吃瓜爆料 - 霹雳霹雳
    吃瓜爆料 - 霹雳霹雳
    1109 阅读 - 09/04
标签云
舔狗日记
友情链接图标 友情链接
Copyright © 2022 - 天津海云互联网络科技有限公司 .All Rights Reserved. ©所有解释归属权归LGZ科技集团(天津)有限公司所有. BY _北海彡制作

已运行 00 天 00 时 00 分 00 秒

总访问：14,974 次丨当前在线：3 人

海云博客公告

海云博客、云服务、API、霹雳霹雳、百宝箱、LGZ、影视、卡密网等由于特殊原因将于2025年3月-6月末暂时停更停维护


正在全力投入开发①音乐解析器 全新UI 功能繁多 可以导入歌单 就像一个免费多功能音乐软件
②多功能影视解析，可免费下载！
③聚合短视频解析保存下载、去水印等. 均可使用登录注册可以使用QQ和邮箱注册.开放开发日志查询(现暂时停止访问日志).

全部免费，全新UI，实用功能！


博客先这样吧，在搞子比很快就好了
欢迎！
一天只弹一次
朕已阅

Warning: Invalid argument supplied for foreach() in /www/wwwroot/mnbt.20739403/usr/plugins/Clogin/Plugin.php on line 158