repl.it
@SagaciousPan/

The Dark Ages [Text Adventure] Version 2.0

HTML, CSS, JS

- New Look

fork
loading
Files
  • index.html
  • css
  • font
  • img
  • js
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>The Dark Ages</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
	<div class="grid-container">
		<div id="head_div" class="head_div"><span style="vertical-align: middle;">The Dark Ages</span></div>
		<div id="top_div" class="top_div">
			<p class="health_p" style="display: inline;">Health: 100%</p>
			<p class="txt_font_01" style="display: inline; padding-left: 4%; padding-right: 4%;"></p>
			<a class="button" href="#" target="_blank" style="display: inline;">How To Play</a>
			<a class="button tool" data-tooltip="Turn music on/off." href="#" style="display: inline;" onclick="audioSwitch()">&nbsp;♫&nbsp;</a>
			<span class="txt_font_01">Text Speed:</span>
			<a class="button" href="#" style="display: inline;" onclick="txtSp(10)">Fast</a>
			<a class="button" href="#" style="display: inline;" onclick="txtSp(50)">Defualt</a>
			<a class="button" href="#" style="display: inline;" onclick="txtSp(100)">Slow</a>
			<p class="txt_font_01" style="display: inline; padding-left: 4%; padding-right: 4%;"></p>
			<p class="energy_p" style="display: inline;">Energy: 100%</p>
		</div>
		<div id="left_div" class="left_div"></div>
		<div id="main_div" class="main_div"></div>
		<div id="right_div" class="right_div"></div>
		<div id="bottom_div" class="bottom_div"></div>
		<div id="foot_div" class="foot_div">
			<span style="vertical-align: middle;">
				<p class="cpyrgt">&copy; The Dark Ages | Story: <a href="#">SagaciousPan</a> | Design: <a href="#">SagaciousPan</a></p>
			</span>
		</div>
	</div>
    <script  src="js/index.js"></script>
    <script src="js/jquery-3.3.1.js"></script>
</body>
</html>
result
console