Skip to content

Instantly share code, notes, and snippets.

@minhajuddin

minhajuddin/calc.html

Created September 2, 2016 11:19
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save minhajuddin/1f838be08e38e68e59ecefc81094ba2e to your computer and use it in GitHub Desktop.
Save minhajuddin/1f838be08e38e68e59ecefc81094ba2e to your computer and use it in GitHub Desktop.
Download ZIP
html session 04
Raw
calc.html
<!doctype html>
<div id='output'>Output: </div>
<input type="text" id="op1" placeholder="Input 1" />
<br>
<input type="text" id="op2" placeholder="Input 2" />
<br>
<button onclick="calculate()">Add</button>
<script>
// outputdiv, red, yellow
function blink(el, first, second){
el.style['background-color'] = first;
setTimeout(function(){
// outputdiv, yellow, red
blink(el, second, first);
},300)
}
function calculate(){
// get the data from the input boxes
var op1 = document.getElementById("op1").value,
op2 = document.getElementById("op2").value,
outputDiv = document.getElementById("output");
// we add
var sum = parseInt(op1) + parseInt(op2);
// we show it in the output
outputDiv.innerHTML = sum;
blink(outputDiv, 'red', 'yellow')
}
</script>
Raw
cumulative_calc.html
<!doctype html>
Result: <div id="output">0</div>
<input type="text" id="operand" />
<br />
<button id='add'>Add</button>
<script>
var add= document.getElementById("add");
add.addEventListener("click", function(){
var op = document.getElementById("operand");
var output = document.getElementById("output");
var result = parseInt(output.innerHTML) + parseInt(op.value);
output.innerHTML = result;
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment