The only known problem so far is that the IE (Internet Explorer) doesn't supports this coding.
<html>
<head>
<title>Age</title>
</head>
<body style="background-color: #294a8f; color: white;" onload="places();">
<center>
<h1>
Find Your Age!</h1>
<fieldset style="border-color: #2c4272; appearance: signature; border-style: outset; width: 210px;">
<legend style="text-align: center;">
<input autofocus type="date" id="date" style="text-align: center; text-transform: capitalize;"/></legend>
<button id="getAge" onclick="age();" style="color: white; background-color: #3b5998; border-color: #3b5998; appearance: push-button;"><b>Age!</b></button>
<div id="age">
</div>
<div id="taken">
</div>
<footer style="font-size: xx-small;" onmouseover="mouseon();" id="note">(Note: The Date Format Should be 0MM-DD-YYYY. Example: 012-08-1997)</footer>
</fieldset>
</center>
<div>
<script>
today=new Date();
var current, current2, time;
current=today.getDate();
var id=document.getElementById('note');
var val=id.innerHTML;
function places(){
place();
}
function place(){
do{
var placeHolder=document.getElementById('date');
var tYear, tMonth, tDate, month;
tYear=today.getFullYear();
tMonth=today.getMonth();
tDate=today.getDate();
if (tMonth == 11) {
month = "Dec";
} else if (tMonth == 10) {
month = "Nov";
} else if (tMonth == 9) {
month = "Oct";
} else if (tMonth == 8) {
month = "Sep";
} else if (tMonth == 7) {
month = "Aug";
} else if (tMonth == 6) {
month = "Jul";
} else if (tMonth == 5) {
month = "Jun";
} else if (tMonth == 4) {
month = "May";
} else if (tMonth == 3) {
month = "Apr";
} else if (tMonth == 2) {
month = "Mar";
} else if (tMonth == 1) {
month = "Feb";
} else {
month = "Jan";
}
tMonth+=1;
if(tMonth>=10){
tMonth="0"+tMonth;
}
else{
tMonth="00"+tMonth;
}
today=new Date();
current2=today.getDate();
placeHolder.placeholder=month+"-"+tDate+"-"+tYear;
placeHolder.title="Your Date of Birth Required. (Note: If you wanna enter the date in number only, you have to do it as: "+tMonth+"-"+tDate+"-"+tYear;
}while(current2>current);
}
function age(){
setInterval(ages);
}
function ages(){
var day1, month1, year1, day2, month2, year2;
var age=document.getElementById("date");
var temp;
age=age.value;
temp=age;
date=new Date(age);
today=new Date();
year1=date.getFullYear();
year2=today.getFullYear();
day1=date.getDate();
day2=today.getDate();
month1=date.getMonth();
month2=today.getMonth();
age=year2-year1;
if (month1> month2) {
age--;
}
if (month1==month2 && day1 > day2) {
age--;
}
if(age<0){
age=0;
}
if(isNaN(age)==true){
age="Invalid Date Of Birth! (Code: 001)";
}
else{
age+=" Years Old!";
}
if(year1>year2){
age="Invalid Date Of Birth! (Code: 002)";
}
else if(year1==year2 && month1>month2){
age="Invalid Date Of Birth! (Code: 003)";
}
else if(year1==year2 && month1==month2 && day1>day2){
age="Invalid Date Of Birth! (Code: 004)";
}
if(!(temp.length<=10)){
document.getElementById('age').innerHTML=age;
document.getElementById('getAge').disabled=true;
document.getElementById('taken').innerHTML="<font size='1'>"+date+"</font>";
}
else{
document.getElementById('getAge').disabled=false;
}
}
function mouseon(){
var size=2;
time=10000;
id.innerHTML='<font size=\''+(size)+'\'>'+val+'</font>';
timeoutID=setInterval(mousedone, time);
}
function mousedone(){
id.innerHTML='<font size=\'1\'>'+val+'</font>';
clearTimeout(timeoutID);
time=10000;
}
</script>
</div>
</body>
</html>
<html>
<head>
<title>Age</title>
</head>
<body style="background-color: #294a8f; color: white;" onload="places();">
<center>
<h1>
Find Your Age!</h1>
<fieldset style="border-color: #2c4272; appearance: signature; border-style: outset; width: 210px;">
<legend style="text-align: center;">
<input autofocus type="date" id="date" style="text-align: center; text-transform: capitalize;"/></legend>
<button id="getAge" onclick="age();" style="color: white; background-color: #3b5998; border-color: #3b5998; appearance: push-button;"><b>Age!</b></button>
<div id="age">
</div>
<div id="taken">
</div>
<footer style="font-size: xx-small;" onmouseover="mouseon();" id="note">(Note: The Date Format Should be 0MM-DD-YYYY. Example: 012-08-1997)</footer>
</fieldset>
</center>
<div>
<script>
today=new Date();
var current, current2, time;
current=today.getDate();
var id=document.getElementById('note');
var val=id.innerHTML;
function places(){
place();
}
function place(){
do{
var placeHolder=document.getElementById('date');
var tYear, tMonth, tDate, month;
tYear=today.getFullYear();
tMonth=today.getMonth();
tDate=today.getDate();
if (tMonth == 11) {
month = "Dec";
} else if (tMonth == 10) {
month = "Nov";
} else if (tMonth == 9) {
month = "Oct";
} else if (tMonth == 8) {
month = "Sep";
} else if (tMonth == 7) {
month = "Aug";
} else if (tMonth == 6) {
month = "Jul";
} else if (tMonth == 5) {
month = "Jun";
} else if (tMonth == 4) {
month = "May";
} else if (tMonth == 3) {
month = "Apr";
} else if (tMonth == 2) {
month = "Mar";
} else if (tMonth == 1) {
month = "Feb";
} else {
month = "Jan";
}
tMonth+=1;
if(tMonth>=10){
tMonth="0"+tMonth;
}
else{
tMonth="00"+tMonth;
}
today=new Date();
current2=today.getDate();
placeHolder.placeholder=month+"-"+tDate+"-"+tYear;
placeHolder.title="Your Date of Birth Required. (Note: If you wanna enter the date in number only, you have to do it as: "+tMonth+"-"+tDate+"-"+tYear;
}while(current2>current);
}
function age(){
setInterval(ages);
}
function ages(){
var day1, month1, year1, day2, month2, year2;
var age=document.getElementById("date");
var temp;
age=age.value;
temp=age;
date=new Date(age);
today=new Date();
year1=date.getFullYear();
year2=today.getFullYear();
day1=date.getDate();
day2=today.getDate();
month1=date.getMonth();
month2=today.getMonth();
age=year2-year1;
if (month1> month2) {
age--;
}
if (month1==month2 && day1 > day2) {
age--;
}
if(age<0){
age=0;
}
if(isNaN(age)==true){
age="Invalid Date Of Birth! (Code: 001)";
}
else{
age+=" Years Old!";
}
if(year1>year2){
age="Invalid Date Of Birth! (Code: 002)";
}
else if(year1==year2 && month1>month2){
age="Invalid Date Of Birth! (Code: 003)";
}
else if(year1==year2 && month1==month2 && day1>day2){
age="Invalid Date Of Birth! (Code: 004)";
}
if(!(temp.length<=10)){
document.getElementById('age').innerHTML=age;
document.getElementById('getAge').disabled=true;
document.getElementById('taken').innerHTML="<font size='1'>"+date+"</font>";
}
else{
document.getElementById('getAge').disabled=false;
}
}
function mouseon(){
var size=2;
time=10000;
id.innerHTML='<font size=\''+(size)+'\'>'+val+'</font>';
timeoutID=setInterval(mousedone, time);
}
function mousedone(){
id.innerHTML='<font size=\'1\'>'+val+'</font>';
clearTimeout(timeoutID);
time=10000;
}
</script>
</div>
</body>
</html>
Comments