jQuery网页版五子棋小游戏源码下载
体验效果:http://hovertree.com/texiao/game/4/
网页五子棋源代码:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>jquery五子棋游戏 -</title> <script type="text/javascript" src="http://hovertree.com/texiao/game/4/hovertreejs/CookieHandle.js"></script> <script src="http://hovertree.com/ziyuan/jquery/jquery-1.11.3.min.js"></script> <link href="http://hovertree.com/texiao/game/4/hovertreejs/jquery.hvtchess5.css" rel="stylesheet" type="text/css" /> <script src="http://hovertree.com/texiao/game/4/hovertreejs/jquery.hvtchess5.js"></script> </head> <body> <div class="wrapper"> <div class="chessboard"> <!-- top line --> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top"></div> <div class="chess-top chess-right"></div> <!-- line 1 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 2 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 3 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 4 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 5 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 6 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 7 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 8 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 9 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 10 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 11 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 12 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- line 13 --> <div class="chess-left"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-middle"></div> <div class="chess-right"></div> <!-- bottom line --> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom"></div> <div class="chess-bottom chess-right"></div> </div> <div class="operating-panel"> <p> <a id="black_btn" class="btn selected" href="#">黑 子</a> <a id="white_btn" class="btn" href="#">白 子</a> </p> <p> <a id="first_move_btn" class="btn selected" href="#">先 手</a> <a id="second_move_btn" class="btn" href="#">后 手</a> </p> <a id="replay_btn" class="btn" href="#">开 始</a> <p id="result_info">胜率:100%</p> <p id="result_tips"></p> </div> <div style="display: none"> <!-- 图片需合并 减少http请求数 --> <img src="http://hovertree.com/texiao/game/4/hovertreepic/black.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/white.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/hover.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/hover_up.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/hover_down.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/hover_up_left.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/hover_up_right.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/hover_left.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/hover_right.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/hover_down_left.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/hover_down_right.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/black_last.png" alt="preload" /> <img src="http://hovertree.com/texiao/game/4/hovertreepic/white_last.png" alt="preload" /> </div> </div> </body> </html>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 展开说说关于C#中ORM框架的用法!
2014-01-05 PHP入门:在Windows中安装PHP工作环境
2014-01-05 Oracle数据库优化的经验总结