Simple html,css and javascript calculator 👨💻
Code output |
<html>
<head>
<style>
body{display: flex;
justify-content: center;
align-items: center;height: 100vh;}
</style>
<script>
function view(num){document.getElementById("result").value += num;}
function compute(){let x = document.getElementById("result").value;
let y = eval(x);
document.getElementById("result").value = y; }
function clr(){document.getElementById("result").value= "";}
</script>
</head>
<body>
<table border="1" bgcolor="blacka">
<tr>
<td align="center" colspan="3"><input type="text" id="result"></td>
<td align="center"><input type="button" value="c" onclick="clr()"></td>
</tr>
<tr>
<td align="center"><input type="button" value="1" onclick="view('1')"/></td>
<td align="center"><input type="button" value="2" onclick="view('2')"/></td>
<td align="center"><input type="button" value="3" onclick="view('3')"/></td>
<td align="center"><input type="button" value="/" onclick="view('/')"/></td>
</tr>
<tr>
<td align="center"><input type="button" value="4" onclick="view('4')"></td>
<td align="center"><input type="button" value="5" onclick="view('5')"></td>
<td align="center"><input type="button" value="6" onclick="view('6')"></td>
<td align="center"><input type="button" value="-" onclick="view('-')"></td>
</tr>
<tr>
<td align="center"><input type="button" value="7" onclick="view('7')"></td>
<td align="center"><input type="button" value="8" onclick="view('8')"></td>
<td align="center"><input type="button" value="9" onclick="view('9')"></td>
<td align="center"><input type="button" value="+" onclick="view('+')"></td>
</tr>
<tr>
<td align="center"><input type="button" value="." onclick="view('.')"></td>
<td align="center"><input type="button" value="0" onclick="view('0')"></td>
<td align="center"><input type="button" value="=" onclick="compute('=')"></td>
<td align="center"><input type="button" value="*" onclick="view('*')"></td>
</tr>
</table>
</body>
</html>
Code 👨💻 download link: 👉 click here... 👈
W3 School website link:👉 click here.. 👈
YouTube channel link 👉:- click here..👈
0 Comments