<!DOCTYPE html><html manifest="offline.appcache"><head> <meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, width=device-width" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> <link rel="apple-touch-icon" href="images/icon.png" /> <link rel="icon" type="image/png" href="images/icon.png" /> <link rel="apple-touch-startup-image" media="(min-device-width: 768px) and (orientation: portrait)" href="images/splash_iPad_portrait.png" /> <link rel="apple-touch-startup-image" media="(min-device-width: 768px) and (orientation: landscape)" href="images/splash_iPad_landscape.png" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <title>Gomoku</title> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> <link rel="stylesheet" href="style/style.css" /> <script src="js/main.js" type="text/javascript"></script> </head> <body ontouchstart=""> <div class="fullscreen-wrapper" id="happy-outer"> <img src="images/happy.png" class="happy-face screen-center" /> </div> <div class="fullscreen-wrapper" id="sad-outer"> <img src="images/sad.png" class="sad-face screen-center" /> </div> <div data-role="page" data-theme="w" id="game-page" class="no-background"> <div data-role="content" class="center no-padding"> <div id="game-region"> <header class="game-ult">Gomoku</header> <div id="game-info" class="game-ult ui-bar ui-bar-e"> <span class="go black"></span> <span class="cont">Your turn.</span> </div> <div id="main-but-group" class="game-ult"> <a href="#new-game" data-rel="dialog" data-role="button" data-icon="grid">New Game</a> <a href="#" id="undo-button" data-icon="back" data-role="button">Undo</a> </div> <div id="other-but-group" class="game-ult"> <a href="#help-page" id="help-button" data-icon="star" data-role="button">About</a> </div> <div class="go-board" data-enhance="false"> </div> <table class="board" data-enhance="false"> <tbody> </tbody> </table> </div> </div> </div> <div id="game-won" data-theme="e" data-role="dialog"> <div data-role="header"> <h4>You Win!</h4> </div> <div data-role="content"> <div id="win-content"> You have won the game! Play again? </div> <fieldset class="ui-grid-a"> <div class="ui-block-a"><button type="submit" class="back-to-game" data-theme="c">Back</button></div> <div class="ui-block-b"> <a href="#new-game" data-rel="dialog" data-role="button" data-icon="grid"> Start A New Game </a> </div> </fieldset> </div> </div> <div id="new-game" data-theme="e" data-role="dialog" class="long-dialog"> <div data-role="header"> <h4>New Game</h4> </div> <div data-role="content"> <fieldset data-role="controlgroup" data-theme="e" id="mode-select"> <legend>Play with</legend> <input type="radio" name="radio-choice-1" id="radio-choice-1" value="vshuman" /> <label for="radio-choice-1">Human</label> <input type="radio" name="radio-choice-1" id="radio-choice-2" value="vscomputer" /> <label for="radio-choice-2">Computer</label> </fieldset> <fieldset data-role="controlgroup" data-theme="e" id="color-select" class="vs-computer"> <legend>Your Color</legend> <input type="radio" name="radio-choice-1" id="radio-choice-2" value="black" data-theme="a" /> <label for="radio-choice-2">Black</label> <input type="radio" name="radio-choice-1" id="radio-choice-1" value="white" data-theme="c" /> <label for="radio-choice-1">White</label> </fieldset> <fieldset data-role="controlgroup" data-theme="e" id="level-select" class="vs-computer"> <legend>Level Of Difficulty</legend> <input type="radio" name="radio-choice-1" id="radio-choice-1" value="novice" /> <label for="radio-choice-1">Novice</label> <input type="radio" name="radio-choice-1" id="radio-choice-2" value="medium" /> <label for="radio-choice-2">Medium</label> <input type="radio" name="radio-choice-1" id="radio-choice-3" value="expert" /> <label for="radio-choice-3">Expert</label> </fieldset> <fieldset class="ui-grid-a"> <div class="ui-block-a"><button type="submit" class="back-to-game" data-theme="c">Back</button></div> <div class="ui-block-b"><button type="submit" id="start-game" data-theme="b">Start</button></div> </fieldset> </div> </div> <div data-role="dialog" data-theme="e" id="help-page"> <div data-role="header"> <h4>About</h4> </div> <div data-role="content" class="thin-content"> <p>I am Yujian and I made this game for fun. You can check out <a href="http://yjyao.com">my website</a> for my other lame projects, or find out more about me. You can also read a bit more about this game <a href="http://yjyao.com/2012/06/gomoku-in-html5.html">here</a>. Or, install this game in Chrome and/or post your comments <a href="https://chrome.google.com/webstore/detail/ngbpiahelilpgbnonpjfaoegaigopepa">here</a>.</p> <p>Also, have fun beating/get beaten by my AI!</p> </div> </div> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-32333016-1']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script></body></html>
HTML5五子棋游戏 画面超酷 可设置难度
需积分: 47 96 浏览量
2016-10-31
15:19:48
上传
评论
收藏 223KB RAR 举报
qq_33152697
- 粉丝: 1
- 资源: 20
最新资源
- Screenshot_20240427_031602.jpg
- 网页PDF_2024年04月26日 23-46-14_QQ浏览器网页保存_QQ浏览器转格式(6).docx
- 直接插入排序,冒泡排序,直接选择排序.zip
- 在排序2的基础上,再次对快排进行优化,其次增加快排非递归,归并排序,归并排序非递归版.zip
- 实现了7种排序算法.三种复杂度排序.三种nlogn复杂度排序(堆排序,归并排序,快速排序)一种线性复杂度的排序.zip
- 冒泡排序 直接选择排序 直接插入排序 随机快速排序 归并排序 堆排序.zip
- 课设-内部排序算法比较 包括冒泡排序、直接插入排序、简单选择排序、快速排序、希尔排序、归并排序和堆排序.zip
- Python排序算法.zip
- C语言实现直接插入排序、希尔排序、选择排序、冒泡排序、堆排序、快速排序、归并排序、计数排序,并带图详解.zip
- 常用工具集参考用于图像等数据处理
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈