Skip to content

Instantly share code, notes, and snippets.

@codingwithsara codingwithsara/index.html Secret
Created Aug 13, 2019

What would you like to do?
jQuery Simple Calculator
<html lang="ja">
<meta charset="utf-8">
<link href="" rel="stylesheet">
* {
font-family: 'Inconsolata', monospace;
color: #555;
body {
background-color: #3fb399;
.container {
width: 320px;
background-color: white;
margin: 120px auto;
table {
width: 100%;
border-color: #f4f4f4;
td {
width: 25%;
button {
width: 100%;
height: 70px;
font-size: 24px;
background-color: white;
border: none;
#inputLabel {
height: 120px;
font-size: 40px;
vertical-align: bottom;
text-align: right;
padding-right: 16px;
background-color: #ececec;
<div class="container">
<table border="1" cellspacing="0">
<td colspan="4" id="inputLabel">0</td>
<td colspan="3"><button>AC</button></td>
<td colspan="2"><button>0</button></td>
<script src=""></script>
var pushed = $(this).text();
var inputLabel = $('#inputLabel');
if (pushed == '=') {
// 計算
} else if (pushed == 'AC') {
// 全てクリア
} else {
if (inputLabel.text() == '0') {
} else {
inputLabel.text(inputLabel.text() + pushed);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.