Skip to content

Instantly share code, notes, and snippets.

@ievgiienko

ievgiienko/calc.html

Created August 3, 2021 04:33
Show Gist options
  • Save ievgiienko/51c8175e892f78167b20d99bbd1c16fa to your computer and use it in GitHub Desktop.
Save ievgiienko/51c8175e892f78167b20d99bbd1c16fa to your computer and use it in GitHub Desktop.
Download ZIP
Raw
calc.html
<html>
<head>
<title>Calculator</title>
<style>
#display, button {
font: bold 32px Impact;
border: 1px solid green;
width: 100px;
padding: 10px;
margin: 10px;
}
#display {
width: 475px;
text-align: right;
}
</style>
</head>
<body>
<div>
<div>
<input type="text" id="display"/>
</div>
<div>
<button onclick="press('7')">7</button>
<button onclick="press('8')">8</button>
<button onclick="press('9')">9</button>
<button onclick="press('+')">+</button>
</div>
<div>
<button onclick="press('4')">4</button>
<button onclick="press('5')">5</button>
<button onclick="press('6')">6</button>
<button onclick="press('-')">-</button>
</div>
<div>
<button onclick="press('1')">1</button>
<button onclick="press('2')">2</button>
<button onclick="press('3')">3</button>
<button onclick="press('*')">*</button>
</div>
<div>
<button onclick="reset()">C</button>
<button onclick="press('0')">0</button>
<button onclick="calc()">=</button>
<button onclick="press('/')">/</button>
</div>
</div>
<script>
let display = document.getElementById("display");
function reset() {
display.value = "";
}
function press(x) {
display.value += x;
}
function calc() {
display.value = eval(display.value);
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment