Created
May 15, 2015 19:37
-
-
Save brookr/f2d8165efccbfc641821 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>Guessing Age in Durations</title> | |
<meta name="description" content="Guessing, Game, Age"> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
</head> | |
<body> | |
<header> | |
<h1>Guess How Long You've Been Alive!</h1> | |
</header> | |
<main> | |
<article> | |
<h2>Time flies, just how much have you used so far?</h2> | |
<figure> | |
<a href="http://pixabay.com/static/uploads/photo/2013/07/12/17/22/hourglass-152090_640.png"><img src="http://pixabay.com/static/uploads/photo/2013/07/12/17/22/hourglass-152090_640.png" alt="default image before playing"></a> | |
<a href="http://pixabay.com/static/uploads/photo/2013/07/12/17/00/remove-151678_640.png"><img src="http://pixabay.com/static/uploads/photo/2013/07/12/17/00/remove-151678_640.png" alt="image for incorrect"></a> | |
<a href="http://pixabay.com/static/uploads/photo/2013/07/12/17/00/approved-151676_640.png"><img src="http://pixabay.com/static/uploads/photo/2013/07/12/17/00/approved-151676_640.png" alt="image for correct"></a> | |
<a href="http://pixabay.com/static/uploads/photo/2012/04/05/00/42/cake-25388_640.png"><img src="http://pixabay.com/static/uploads/photo/2012/04/05/00/42/cake-25388_640.png" alt="you won!"></a> | |
<figcaption>image that changes depending on game state</figcaption> | |
</figure> | |
<p id='game-messages'>input messages go here</p> | |
<label for='name-input'>Name: </label> | |
<input id='name-input' type="text"> | |
<button type="button" id="start-button">Start</button> | |
<button type="submit" id="quit-button">Quit</button> | |
<p id='game-result'></p> | |
</article> | |
<article> | |
<h2>Instructions:</h2> | |
<ol> | |
<li>Put in your birthday and time, be as precise as possible!</li> | |
<li>Input your guess and click submit.</li> | |
<li>If your answer is within 10% of the correct value you win!</li> | |
<li>Keep guessing till you get all the answers correct.</li> | |
</ol> | |
<p>You can quit at anytime by typing "quit"</p> | |
</article> | |
<aside> | |
<h2>Player Information</h2> | |
<h3>Player Name: <span id="player-name"></span></h3> | |
<time id="birthdate">May 28, 1985</time> | |
<time id="current-date">May 14, 2015</time> | |
<p>Guesses Used: <span id="guesses-used"></span></p> | |
</aside> | |
</main> | |
<footer> | |
<p>Created by: Nick Kuhn</p> | |
</footer> | |
<script src="game.js"></script> | |
</body> | |
</html> | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment