Kalkulator wieku

Oblicz czas jaki upłynął od dnia Twoich urodzin. W polach formularza wprowadź datę urodzenia.

Kalkulator obliczy Twój wiek w przeliczeniu na lata, miesiące, tygodnie oraz dni. W zasadzie kalkulator wieku działa podobnie jak każdy inny kalkulator dni z tą różnicą, że oblicza nasz wiek 😎.

Lata

Miesiące

Dni

Jak wstawić gadżet na własną stronę?

Można to zrobić ręcznie lub pobrać gotowca i go edytować jak dusza zapragnie.

Tworzymy odpowiednie pliki:

index.html
style.css
script.js

index.html

<!DOCTYPE html>
<html lang="pl">
<head>
    <title>Obliczanie wieku</title>

    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&display=swap" rel="stylesheet">

    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <div class="inputs-wrapper">
            <input type="date" id="date-input">
            <button onclick="ageCalculate()">Oblicz</button>
        </div>
        <div class="outputs-wrapper">
            <div>
                <span id="years">
                    -
                </span>
                <p>
                    Lata
                </p>
            </div>
            <div>
                <span id="months">
                    -
                </span>
                <p>
                   Miesiące
                </p>
            </div>
            <div>
                <span id="days">
                    -
                </span>
                <p>
                    Dni
                </p>
            </div>
        </div>
    </div>
    <script src="script.js"></script>
</body>
</html>

style.css

*,
*:before,
*:after{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
body{
    background-color: #FFF;
}
.container{
    width: 40%;
    min-width: 450px;
    position: relative;
    transform: translate(-50%,-50%);
    left: 50%;
    top: 50%;
    padding: 50px 30px;
    border: solid 1px #CCC;
    border-radius: 8px;
}
.container *{
    font-family: "Poppins",sans-serif;
    border: none;
    outline: none;
}
.inputs-wrapper{
    background-color: #080808;
    padding: 30px 25px;
    border-radius: 8px;
    box-shadow: 0 15px 20px rgba(0,0,0,0.3);
    margin-bottom: 50px;
}
input,
button{
    height: 50px;
    background-color: #ffffff;
    color: #080808;
    font-weight: 500;
    border-radius: 5px;
}
input{
    width: 60%;
    padding: 0 20px;
    font-size: 14px;
}
button{
    width: 30%;
    float: right;
}
.outputs-wrapper{
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.outputs-wrapper div{
    height: 100px;
    width: 100px;
    background-color: #080808;
    border-radius: 5px;
    color: #ffffff;
    display: grid;
    place-items: center;
    padding: 20px 0;
    box-shadow: 0 15px 20px rgba(0,0,0,0.3);
}
span{
    font-size: 30px;
    font-weight: 500;
}
p{
    font-size: 14px;
    color: #808080;
    font-weight: 400;
}

script.js

// www.skrip.pl
const months = [31,28,31,30,31,30,31,31,30,31,30,31];

function ageCalculate(){
    let today = new Date();
    let inputDate = new Date(document.getElementById("date-input").value);
    let birthMonth,birthDate,birthYear;
    let birthDetails = {
        date:inputDate.getDate(),
        month:inputDate.getMonth()+1,
        year:inputDate.getFullYear()
    }
    let currentYear = today.getFullYear();
    let currentMonth = today.getMonth()+1;
    let currentDate = today.getDate();

    leapChecker(currentYear);

    if(
        birthDetails.year > currentYear ||
        ( birthDetails.month > currentMonth && birthDetails.year == currentYear) || 
        (birthDetails.date > currentDate && birthDetails.month == currentMonth && birthDetails.year == currentYear)
    ){
        alert("Ne urodził się jescze");
        displayResult("-","-","-");
        return;
    }

    birthYear = currentYear - birthDetails.year;

    if(currentMonth >= birthDetails.month){
        birthMonth = currentMonth - birthDetails.month;
    }
    else{
        birthYear--;
        birthMonth = 12 + currentMonth - birthDetails.month;
    }

    if(currentDate >= birthDetails.date){
        birthDate = currentDate - birthDetails.date;
    }
    else{
        birthMonth--;
        let days = months[currentMonth - 2];
        birthDate = days + currentDate - birthDetails.date;
        if(birthMonth 
<br>
<button id="javalBtn" onclick="copyJAVA()" style="border: 1px solid #fafafa; background: #ff0000; cursor: pointer; font-size: 14px; font-weight: 500; padding: 5px 30px;">Kopiuj</button>
<script>
    function copyJAVA() {
      const text = document.querySelector("#javaText");
      const btnText = document.querySelector("#javaBtn");
      text.select();
      document.execCommand("copy");
      btnText.textContent = "Copied";
      setTimeout(function(){
          btnText.textContent = "Copy";
      }, 5000);
}
</script>

Top Stories

Wangiri scam – jak nie zostać ofiarą

Statystyki wyszukiwarki PornHub za 2024 rok

Prosty sposób na zdobycie 1000 GB transferu danych na rok w Orange na kartę

Prosty kalkulator wieku v.1 na stronę www

Oblicz czas jaki upłynął od dnia Twoich urodzin. W polach formularza wprowadź datę urodzenia.

Kalkulator wieku

Jak wstawić gadżet na własną stronę?

index.html

style.css

script.js

WOŚP 2025

Chmurka tagów

Zaprzyjaźniona strona

Najczęściej oglądane wpisy