-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
62 lines (56 loc) · 3.34 KB
/
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
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Calculator</title>
</head>
<body>
<!-- 3. Create a basic HTML calculator with buttons for each digit, each of the above functions and an “Equals” key.
Do not worry about wiring up the JS just yet.
There should also be a display for the calculator. Go ahead and fill it with some dummy numbers so it looks correct.
Add a “clear” button. -->
<div id="main-section">
<div class="result-box">
<p id="brand-name">casio</p>
<input type="text" id="inputvalue" class="resultBox">
<!-- <div class="resultnext" id="same"> -->
</div>
<div class="buttons-directions">
<div class="row-directions">
<button class="acClearAll allButtons" value="" onclick="clearAll()">AC</button>
<button class="deletePrevious allButtons" value="" onclick="">←</button>
<button class="opretion allButtons" value="%" onclick="display('%')" >%</button>
<button class="opretion allButtons" value="/" onclick="display('/')">÷</button>
</div>
<div class="row-directions">
<button class="numberButton allButtons" value="7" onclick="display('7')" >7</button>
<button class="numberButton allButtons" value="8" onclick="display('8')" >8</button>
<button class="numberButton allButtons" value="9" onclick="display('9')">9</button>
<button class="opretion allButtons" value="" onclick="display('')">*</button>
</div>
<div class="row-directions">
<button class="numberButton allButtons" value="4" onclick="display(4)">4</button>
<button class="numberButton allButtons" value="5" onclick="display(5)">5</button>
<button class="numberButton allButtons" value="6" onclick="display(6)">6</button>
<button class="opretion allButtons" value="-" onclick="display('-')">-</button>
</div>
<div class="row-directions">
<button class="numberButton allButtons" value="1" onclick="display(1)">1</button>
<button class="numberButton allButtons" value="2" onclick="display(2)">2</button>
<button class="numberButton allButtons" value="3" onclick="display(3)">3</button>
<button class="opretion allButtons" value="+" onclick="display('+')">+</button>
</div>
<div class="row-directions">
<button class="numberButton allButtons" value="0" onclick="display('0')">0</button>
<button class="numberButton allButtons" value="00" onclick="display('00')">00</button>
<button class="opretion allButtons dotButton" value="." onclick="display('.')">.</button>
<button class="opretion opretionButton allButtons" value="">=</button>
</div>
</div>
</div>
</body>
<script src="script.js"></script>
</html>