<!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小游戏五子棋
需积分: 9 185 浏览量
2017-12-10
17:40:47
上传
评论 1
收藏 230KB ZIP 举报
wuziqi.zip （12个子文件） 
wuziqi style 
wood.jpg 11KB woodfloor.jpg 103KB images 
ajax-loader.png 366B icons-18-white.png 2KB
style.css 18KB
index.html 502B .DS_Store 6KB images sad.png 36KB happy.png 63KB js main.js 12KB ai-worker.js 4KB game.html 5KB资源评论
