Calculator Tools Calculator Tools
Create

JunyTony Caculadora de anos

Jan 3, 2024

About this app

Calculadora de anos para determinar sua idade

JunyTony Caculadora de anos JunyTony Calculadora de Anos Data de Nascimento: Calcular Sua idade é: anos

Related apps

Put this on your site

Source

                    <html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">

<title>JunyTony Caculadora de anos</title>
<meta name="description" content="Calculadora de anos para determinar sua idade">
<meta name="keywords" content="calculadora, anos, idade, data de nascimento">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">

<script type="text/javascript">
try {
// App Javascript Goes Here. Place your entire script content inside the try block for error handling.
document.addEventListener("DOMContentLoaded", function() {
// Function to calculate age based on birthdate
function calculateAge() {
var birthdate = document.getElementById("birthdate").value;
var currentDate = new Date();
var yearDiff = currentDate.getFullYear() - birthdate.split("-")[0];
var monthDiff = currentDate.getMonth() + 1 - birthdate.split("-")[1];
var dayDiff = currentDate.getDate() - birthdate.split("-")[2];

if (monthDiff < 0 || (monthDiff === 0 && dayDiff < 0)) {
yearDiff--;
}

document.getElementById("age").innerHTML = yearDiff;
}

// Event listener for calculate button
document.getElementById("calculate-btn").addEventListener("click", function() {
calculateAge();
});
});

} catch (error) {
// This will throw the error to the parent window.
throw error;
}
</script>

<style>
/* App CSS Goes Here */
body {
font-family: 'Roboto', sans-serif;
}

.container {
max-width: 500px;
margin: 0 auto;
padding: 20px;
}

h1 {
text-align: center;
font-size: 24px;
margin-bottom: 20px;
}

.form-group {
margin-bottom: 20px;
}

label {
display: block;
font-size: 18px;
margin-bottom: 10px;
}

input[type="date"] {
width: 100%;
padding: 10px;
font-size: 16px;
}

.btn {
width: 100%;
padding: 10px;
font-size: 18px;
background-color: #e91e63;
color: #fff;
border: none;
cursor: pointer;
}

.result {
text-align: center;
font-size: 24px;
margin-top: 20px;
font-weight: bold;
}
</style>
</head>
<body>
<div id="main-container" class="container">
<h1>JunyTony Calculadora de Anos</h1>
<div class="form-group">
<label for="birthdate">Data de Nascimento:</label>
<input type="date" id="birthdate">
</div>
<button id="calculate-btn" class="btn">Calcular</button>
<div class="result">
Sua idade é: <span id="age"></span> anos
</div>
</div>
</body>
</html>