mirror of
https://github.com/arfct/itty-bitty.git
synced 2026-03-11 08:54:33 +00:00
15 lines
1.1 KiB
HTML
15 lines
1.1 KiB
HTML
|
<style type="text/css">
|
|||
|
|
body {margin:4vmin auto; width:74vmin; background:#eee; font-size: 8vmin; font-family:sans-serif;}
|
|||
|
|
input, div { height:2em; border-radius: 1em; font-size:1em;}
|
|||
|
|
input {width:6.8em; padding: 0 1em; margin:0 0.4em 0.4em 0; text-align:right; border:none;}
|
|||
|
|
div {width:2em; background:#fff; border:none; margin:0 0.4em 0.4em 0; display:inline-block; text-align:center; line-height:2em;}
|
|||
|
|
div:active {background:red; color:white;}
|
|||
|
|
div:nth-child(5n + 2) { background:#4A90E2; color:white; margin-right:0;}
|
|||
|
|
</style>
|
|||
|
|
<input type="text"><div onclick="field.value = ''">C</div><br><div>7</div><div>8</div><div>9</div><div>÷</div><br><div>4</div><div>5</div><div>6</div><div>×</div><br><div>1</div><div>2</div><div>3</div><div>-</div><br><div>.</div><div>0</div><div onclick="field.value = eval(field.value.replace('÷', '/').replace('×', '*'))">=</div><div>+</div>
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
var field = document.querySelector('input');
|
|||
|
|
document.querySelectorAll('div').forEach(function(div) {
|
|||
|
|
if (!div.onclick) div.onclick = function(div) { field.value += this.innerText; }
|
|||
|
|
});
|
|||
|
|
</script>
|