-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
50 lines (49 loc) · 2.54 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
<!DOCTYPE html>
<html>
<head>
<title>Student Loan Calculator</title>
<link rel="stylesheet" href="style.css">
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<link href="/style.css" rel="stylesheet">
</head>
<body>
<div class="model">
<div id="about">
<div class="heading"><u>Student Loan Calculator</u></div> <br>
A student loan calculator is a tool that estimates monthly payments and total cost of student loans by considering factors like loan amount, interest rate, loan term, and repayment plan. It is useful for students to compare loan options and track their progress. To use a calculator, enter accurate information, compare loan options and repayment plans, and use the calculator to track progress.
</div>
<div id="box">
<form class="containerop">
<div class="input-container">
<label for="amount">Loan Amount(₹)</label>
<input type="number" id="amount" required>
</div>
<div class="input-container">
<label for="interest">Interest Rate(%)</label>
<input type="number" id="interest" step="0.01" required>
</div>
<div class="input-container loan-tenure-container">
<label for="loanTenure">Loan Tenure</label>
<input type="text" id="loanTenure" required>
<div class="radio-container">
<input type="radio" name="btn" id="year"><label for="year">Year</label>
<input type="radio" name="btn" id="month"><label for="month">Month</label>
</div>
</div>
<div class="submit-container">
<input type="submit" value="Submit" id="calculate">
</div>
<div class="output">
<p class="op">Loan EMI <span id="emi">₹</span></p>
<p class="op">Total Interest Payable <span id="totalInterest">₹</span></p>
<p class="op">Total Payment(Principal + Interest)<span id="totalPayment">₹</span> </p>
</div>
</form>
<div style="width: 100%; max-width: 600px; margin: 0 auto;">
<canvas id="pieChart" width="400" height="400"></canvas>
</div>
</div>
</div>
<script src="script.js"></script>
</body>
</html>