-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
173 lines (138 loc) · 5.05 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Calculators</title>
<link rel="stylesheet" href="index.css">
</head>
<body>
<h1>Calculators</h1>
<div class="bigbox">
<div class="cs">
<h1 class="cs--h1">BMI Calculator</h1>
<div class="cs--h1">
<p id="age"></p>
<br>
<input placeholder="Weight" type="number" name="" id="weight">
<br>
<input placeholder="Height" type="number" name="" id="height">
<h3>Click here to Calculate if you are healthy or not.</h3>
<button onclick="bmical()">BMI</button>
</div>
</div>
<div class="calculator">
<div class="inputs">
<input type="number" name="" id="first">
<br>
<input type="number" name="" id="second">
</div>
<div class="symbols">
<div class="basic">
<button id="addb" onclick="addition()">+</button>
<button id="subb" onclick="subtraction()"> - </button>
<button id="mulb" onclick="mutiplication()"> * </button>
<button id="divb" onclick="division()">/</button>
</div>
<div class="clear">
<button onclick="clearinputs()">Clear</button>
</div>
<div class="exponents">
<button id="squareb" onclick="square()">Square</button>
<button id="cubeb" onclick="cube()">Cube</button>
</div>
<div class="men">
<button id="perimeterb" onclick="perimeter()">Perimeter</button>
<button id="areab" onclick="area()">Area</button>
</div>
<h1 id="answer">result</h1>
</div>
<br>
</div>
<div class="cs">
<h1 class="cs--h1">Age Calculator</h1>
<div class="cs--h1">
<p id="age"></p>
<br>
<h3>Click here to Calculate your age</h3>
<button onclick="agecal()">Year of Birth</button>
</div>
</div>
</div>
<h3>Created by Baljot</h3>
<script>
let first = document.getElementById("first")
let second = document.getElementById("second")
let result = document.getElementById("answer")
function addition() {
let num1 = first.value
let num2 = second.value
num1 = parseInt(num1)
num2 = parseInt(num2)
let solution = num1 + num2
result.innerText = solution
}
function subtraction() {
let num1 = first.value
let num2 = second.value
let solution = num1 - num2
result.innerText = solution
}
function mutiplication() {
let num1 = first.value
let num2 = second.value
let solution = num1 * num2
result.innerText = solution
}
function division() {
let num1 = first.value
let num2 = second.value
let solution = num1 / num2
result.innerText = solution
}
function clearinputs() {
prompt()
document.getElementById("first").value = ""
document.getElementById("second").value = ""
}
function square() {
let num1 = first.value
let solution = num1 * num1
result.innerText = solution
}
function cube() {
let num1 = first.value
let solution = num1 * num1 * num1
result.innerText = solution
}
function perimeter() {
let num1 = first.value
let num2 = second.value
let calculation = num1 * 2
let calculation2 = num2 * 2
let solution = calculation + calculation2
result.innerText = solution
}
function area() {
let num1 = first.value
let num2 = second.value
solution = num1 * num2
result.innerText = solution
}
if (num1 < 0) {
document.write("Invalid Number")
}
function agecal() {
let year = prompt("What year where you born?")
let calculation = 2022 - year
document.getElementById("age").innerText = calculation
}
function bmical() {
let weight = document.getElementById("weight").value
let height = document.getElementById("height").value
let calculation = weight / height * height
}
</script>
</body>
</html