This simple app used to convert Ethiopian Geeze number converter to Arabic number. I hope it will introduce also the Ethiopian Geeze number to the out side world
A Pen by mohammedadem on CodePen.
This simple app used to convert Ethiopian Geeze number converter to Arabic number. I hope it will introduce also the Ethiopian Geeze number to the out side world
A Pen by mohammedadem on CodePen.
<body> | |
<div class="header"> simple calculator</div> | |
<div class="box"> | |
<form name="simplecalculator"> | |
<div class="row"> | |
<div id="screen"> | |
</div> | |
<div> | |
<input type=button name=clear id="clear"value=C></div> | |
</div> | |
<input type=button name= key9 value=9 class="btn"> | |
<input type=button name= key8 value=8 class="btn"> | |
<input type=button name= key7 value=7 class="btn"> | |
<input type=button name= keyadd value=+ class="btn"id="operator"></br> | |
<input type=button name= key6 value=6 class="btn"> | |
<input type=button name= key5 value=5 class="btn"> | |
<input type=button name= key4 value=4 class="btn"> | |
<input type=button name= keysub value=- class="btn"id="operator"></br> | |
<input type=button name= key3 value=3 class="btn"> | |
<input type=button name= key2 value=2 class="btn"> | |
<input type=button name= key1 value=1 class="btn"> | |
<input type=button name= keymult value=* class="btn"id="operator"></br> | |
<input type=button name= key0 value=0 class="btn"> | |
<input type=button name= keydot value=. class="btn"> | |
<input type=button name= keyeq value== class="btn"> | |
<input type=button name= keydiv value=/ class="btn"id="operator"></br> | |
</form> | |
</div> | |
</body> |
$(document).ready(function(){ | |
//$(this).attr("value"); | |
//calling a function which clears the screen | |
clearScreen(); | |
//when any button is clicked it showed up on the screen | |
$(".btn").click(function () { | |
var result= document.getElementById("screen"); | |
if($(this).attr("value")=="="){ | |
result.innerHTML= eval( result.innerHTML); | |
} | |
else{ | |
result.innerHTML+= $(this).attr("value"); | |
} | |
}); | |
}); | |
//a function which clears the screen | |
function clearScreen(){ | |
document.getElementById("clear").addEventListener("click",function(){ | |
document.getElementById("screen").innerHTML=""; | |
}); | |
} |
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script> |
.header{ | |
font-family: lobster; | |
font-size: 40px; | |
text-align:center; | |
text-shadow: 2px 2px 3px; | |
} | |
#clear{ | |
float:left; | |
cursor:pointer; | |
top:0; | |
position : relative; | |
width:60px; | |
height:36px; | |
background:#F25C81 ; | |
border-radius:3px; | |
margin:0 7px 11px 0; | |
text-align : center; | |
line-height:36px; | |
line-spacing:1px; | |
padding:0 10px; | |
} | |
.box{ | |
margin:auto; | |
padding: 20px 20px 9px; | |
height:290px; | |
width: 325px; | |
background-color:#252727; | |
border-radius:5px; | |
box-shadow: 0px 5px 5px | |
} | |
#screen{ | |
margin:0 7px 11px 0; | |
height:36px; | |
width:200px; | |
float:left; | |
padding:3px 3px; | |
border-radius:3px; | |
font-size:18px; | |
background-color:#EFF7F7; | |
text-align:right; | |
color:black; | |
} | |
.btn{ | |
float:left; | |
cursor:pointer; | |
top:0; | |
position : relative; | |
width:60px; | |
height:36px; | |
background:white; | |
border-radius:3px; | |
margin:0 7px 11px 0; | |
text-align : center; | |
line-height:36px; | |
line-spacing:1px; | |
padding:0 10px; | |
} | |
#operator{ | |
background:#9BE1E0 ; | |
} | |
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> |