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>
更多：http://www.cnblogs.com/roucheng/p/texiao.html
jQuery网页版五子棋小游戏源码下载的更多相关文章
- HTML5小游戏源码收藏
html5魅族创意的贪食蛇游戏源码下载 html5网页版打砖块小游戏源码下载 html5 3D立体魔方小游戏源码下载 html5网页版飞机躲避游戏源码下载 html5三国人物连连看游戏源码下载 js ...
- jQuery实践-网页版2048小游戏
▓▓▓▓▓▓ 大致介绍 看了一个实现网页版2048小游戏的视频,觉得能做出自己以前喜欢玩的小游戏很有意思便自己动手试了试,真正的验证了这句话-不要以为你以为的就是你以为的,看视频时觉得看懂了,会写了, ...
- Creator仿超级玛丽小游戏源码分享
Creator仿超级玛丽小游戏源码分享 之前用Cocos Creator 做的一款仿超级玛丽的游戏,使用的版本为14.2 ,可以直接打包为APK,现在毕设已经完成,游戏分享出来,大家一起学习进步.特别 ...
- html5 canvas简易版捕鱼达人游戏源码
插件描述:html5利用canvas写的一个js版本的捕鱼,有积分统计,鱼可以全方位移动,炮会跟着鼠标移动,第一次打开需要鼠标移出背景图,再移入的时候就可以控制炮的转动,因为是用的mouseover触 ...
- ios版弹珠游戏源码
这个是我们比较喜欢玩的一直小游戏的,ios版弹珠游戏源码,该游戏源码来着IOS教程网其他网友提供上传的,大家可以了解一下吧. nore_js_op> <ignore_js_op&g ...
- Android版的疯狂猜图游戏源码完整版分享
这个游戏源码是在安装教程网那么分享过来的,Android版的疯狂猜图游戏源码完整版分享,也是本人之前很早以前发的一款游戏源码的,大家如果想了解一下,可以看看吧,不说多了,上一个图先吧. > ...
- ios水果风暴游戏源码下载
游戏源码是从那个IOS教程网IOS.662p.com分享给大家的. 这是一款ios水果风暴游戏源码下载,介绍给大家一下,喜欢的朋友可以下载学习一下吧.应用介绍:这是一个以获得高分和挑战更高难度为目的的 ...
- 推荐几个c/c++语言编写的游戏源码下载网站
在游戏开发的学习或工作中,利用完好的游戏源码可以事半功倍,不仅可以逆向学习开拓思维,也可以大大减少设计周期.自己浏览了很游戏源码下载的网站,发现大多数质量都良莠不齐,且大部分需要消费才能下载,下面整理 ...
- 10款基于jquery的web前端特效及源码下载
1.jQuery时间轴插件:jQuery Timelinr 这是一款可用于展示历史和计划的时间轴插件,尤其比较适合一些网站展示发展历程.大事件等场景.该插件基于jQuery,可以滑动切换.水平和垂直滚 ...
随机推荐
- Expert 诊断优化系列------------------冤枉磁盘了
现在很多用户被数据库的慢的问题所困扰,又苦于花钱请一个专业的DBA成本太高.软件维护人员对数据库的了解又不是那么深入,所以导致问题迟迟不能解决,或只能暂时解决不能得到根治.开发人员解决数据问题基本又是 ...
- 剑指Offer面试题：11.打印1到最大的n位数
一.题目:打印1到最大的n位数 题目:输入数字n,按顺序打印出从1最大的n位十进制数.比如输入3,则打印出1.2.3一直到最大的3位数即999. 二.不同的解法 2.1 不假思索的解法 最容易想到的办 ...
- Net作业调度(四)—quartz.net持久化和集群
介绍 在实际使用quartz.net中,持久化能保证实例重启后job不丢失. 集群能均衡服务器压力和解决单点问题. quartz.net在这两方面配置都比较简单. 持久化 quartz.net的持久化 ...
- SQL Server 变更数据捕获(CDC)
标签:SQL SERVER/MSSQL SERVER/数据库/DBA/字段/对象更改 概述 变更数据捕获用于捕获应用到 SQL Server 表中的插入.更新和删除活动,并以易于使用的关系格式提供这些 ...
- RTSP协议转换RTMP直播协议
RTSP协议转换RTMP直播协议 RTSP协议也是广泛使用的直播/点播流媒体协议,最近实现了一个RTSP协议转换RTMP直播协议的程序,为的是可以接收远端设备或服务器的多路RTSP直播数据,实时转换为 ...
- com.android.build.api.transform.TransformException: com.android.builder.packaging.DuplicateFileException: Duplicate files copied in APK assets/com.xx.xx
完整的Error 信息(关键部分) Error:Execution failed for task ':fanwe_o2o_47_mgxz_dingzhi:transformResourcesWith ...
- Android-找到包下面所有的类
Android 利用反射找到包下面所有的类 Android下其实有一个DexFile的东西,利用它我们可以很好的找到包下面所有的类 什么是DexFile? 官方的说明是这样的: Manipulates ...
- 浅谈ThinkPHP3.2的子域名部署和路由优化（一）
前言:建立一个网站系统,往往包含多个子网站,例如PC官网,移动端官网,后台管理,数据源自一个相同的数据库,整个架构上,从ThinkPHP来看,可以大体理解为Model(M)是一样的,Controlle ...
- SSIS Design6：利用数据流
数据流利用内存来缓冲数据,并在内存中处理数据转换,由于内存的访问速度是非常快的,所以SSIS数据流转换性能是非常高效的.SSIS Engine将数据分批加载到内存中,当Data Flow将一批新的数据 ...
- 前端MVVM框架avalon揭秘 - 双向绑定原理
avalon大家可能不熟悉,但是Knockout估计或多或少听过用过,那么说说KO的几个概念 监控属性(Observables)和依赖跟踪(Dependency tracking) 声明式绑定(Dec ...