<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <h1>RBI SIR AGE APP</h1> <h2>NAME:[RBISIR]<br><input type = "text" placeholder = "ENTER NAME[RBI SIR]" autofocus/></h2> <div id = "disBlock"> <p id = "disBD"></p> <p id = "display"></p> <p id = "time"></p> </div> <div id = "postCredit"> <p id = "credit"></p> <a id = "about" href="https://rbisir1.bio.link" target="_blank">MORE[RBISIR]</a> </div> <form> <label>[RBISIR]BIRTHDATE<input type = "date"/></label><br> <button type = "button">+[RBISIR]</button> <button type = "reset">-[RBISIR]</button> </form> <style> @import url('https://fonts.googleapis.com/css?family=Gotu&display=swap'); body { background-color: dodgerblue; font-family: 'Gotu', sans-serif; color: white; } label { font-size: 20px; } form { text-align: center; } input { border: 0; padding: 10px 20px; font-size: 20px; border-radius: 50px; margin: 5px; } h2 { text-align: center; } button { padding: 10px; width: 300px; margin: 10px 0; font-size: 20px; border: 0; } button:focus, button:hover { background-color: black; color: white; } p { text-align: center; } div { border: 1px solid white; background-color: black; text-align: center; } #postCredit { background-color: powderblue; color: black; } a { text-decoration: none; color: black; display: block; padding: 10px; background-color: white; } a:hover { background-color: cyan; } h1 { background-color: black; margin: 0 0 20px 0; padding: 10px; text-align: center; } </style> <script> let display = document.getElementById("display"); let input = document.getElementsByTagName("input"); let button = document.getElementsByTagName("button"); let time = document.getElementById("time"); let disBlock = document.getElementById("disBlock"); let disBD = document.getElementById("disBD"); let creditBlock = document.getElementById("postCredit"); let credit = document.getElementById("credit"); let about = document.getElementById("about"); disBlock.style.display = "none"; creditBlock.style.display = "none"; let dob = new Date(), today = new Date(), calTime; function samay() { let d = new Date(); time.innerHTML = d.getHours() + " HOURS, " + d.getMinutes() + " MINUTES, " + d.getSeconds() + " SECONDS OLD"; } function calculate() { disBlock.style.display = "block"; creditBlock.style.display = "block"; credit.innerHTML = "[RBISIR]SOFTWARE ENGINEER"; let x = input[1].value.split("-"); dob.setDate(x[2]); dob.setMonth(x[1] - 1); dob.setFullYear(x[0]); let year, month, day, HBD; day = (function() { if(today.getDate() > dob.getDate()) { return today.getDate() - dob.getDate() - 1; } else if(today.getDate() == dob.getDate()) { return today.getDate() - dob.getDate(); } else { let calDate = new Date(dob.getFullYear(), dob.getMonth() + 1, 0); return (today.getDate() + calDate.getDate()) - dob.getDate() - 1; } }()); month = (function() { if(today.getMonth() >= dob.getMonth()) { if(today.getDate() >= dob.getDate()) { return today.getMonth() - dob.getMonth(); } else { if((today.getMonth() - 1) >= dob.getMonth()) { return (today.getMonth() - 1) - dob.getMonth(); } else { return ((today.getMonth() - 1) + 12) - dob.getMonth(); } } } else { if(today.getDate() >= dob.getDate()) { return (today.getMonth() + 12) - dob.getMonth(); } else { return ((today.getMonth() - 1) + 12) - dob.getMonth(); } } }()); year = (function() { if(dob.getMonth() == today.getMonth()) { if(dob.getDate() > today.getDate()) { return (today.getFullYear() - 1) - dob.getFullYear(); } else { return today.getFullYear() - dob.getFullYear(); } } else { if(dob.getMonth() > today.getMonth()) { return (today.getFullYear() - 1) - dob.getFullYear(); } else { return today.getFullYear() - dob.getFullYear(); } } }()); HBD = (function(){ if(today.getMonth() == dob.getMonth()) { if(today.getDate() == dob.getDate()) { disBD.innerHTML = "RBI SIR FOUND AGE<br>"; } else { disBD.innerHTML = ""; } } else { disBD.innerHTML = ""; } }()); display.innerHTML = "FOR: " + input[0].value + ", <br/>[RBISIR]YOU ARE " + year + " YEARS, " + month + " MONTHS, " + day + " DAYS, "; calTime = setInterval(samay, 1000); } button[0].onclick = calculate;//when calculate button is clicked function reset() { input[0].focus(); display.innerHTML = ""; time.innerHTML = null; clearInterval(calTime); disBlock.style.display = "none"; creditBlock.style.display = "none"; } button[1].onclick = reset;//when the reset button is clicked </script>