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,可以滑动切换.水平和垂直滚 ...
随机推荐
- Java NIO2：缓冲区
什么是缓冲区 一个缓冲区对象是固定数量的数据的容器,其作用是一个存储器,或者分段运输区,在这里数据可被存储并在之后用于检索.缓冲区像前篇文章讨论的那样被写满和释放,对于每个非布尔原始数据类型都有一个缓 ...
- HTML和CSS经典布局4
如下图: 需求: 1. 如图 2. 可以从body标签开始. <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xht ...
- 企业IT管理员IE11升级指南【6】—— Internet Explorer 11面向IT专业人员的常见问题
企业IT管理员IE11升级指南 系列: [1]—— Internet Explorer 11增强保护模式 (EPM) 介绍 [2]—— Internet Explorer 11 对Adobe Flas ...
- EF：根据实体类生成表结构SQL
根据实体类生成表结构SQL: PM> Enable-Migrations -ProjectName Domain -StartUpProjectName Handler -Force PM> ...
- SqlServer英文单词全字匹配
环境:Vs2013+Sql Server2012 问题:现在数据库记录如下: Sentence列保存的是英文的句子,我现在想找出所有包含“I”(单词)的句子,如果我用 Sentence like '% ...
- Java批处理ExecutorService/CompletionService
服务端接收一个请求,常常需要同时进行几个计算或者向其他服务发送请求,最后拼装结果返回上游.本文就来看下JDK提供几个并行处理方案,牵涉到ExcecutorService/CompletionServi ...
- WebDriver--简单的元素操作
以登录163邮箱为例,演示以下几个方法的使用 ①switch_to.frame() ②.clear() ③.send_keys() ④.click() ⑤switch_to_default_conte ...
- Juint整合Log4j
一般Log4j配置在web.xml中,在单元测试时,不需要启动Tomcat,所有Log4j找不到配置文件 在测试类中手动加载 配置文件 PropertyConfigurator.configure(& ...
- KnockoutJS 3.X API 第八章 映射(mapping)插件
Knockout旨在允许您将任意JavaScript对象用作视图模型. 只要一些视图模型的属性是observables,您可以使用KO将它们绑定到您的UI,并且UI将在可观察属性更改时自动更新. 大多 ...
- 【源码】谷歌代理~WPF简单小软件-2015-10-15首发 （2016-03-01已更新源）
蛋疼,昨天把代理去了后才发现,原来咱们连谷歌应用都访问不了,,,用别人的总觉得不怎么安全,然后今天早上就编了个小软件干掉他这限制==> GoogleProxy.exe [主要目的:为了能在线安 ...