Lorem ipsum dolor sit amet, consectetur adipiscing elit. Test link

javascript digital clock project

javascript digital clock project,javascript clock,html css javascript clock,build clock with javascript,javascript clock tutorial,javascript clock
 html code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <div class="box" id="hour">00</div>
        <div class="box" id="min">00</div>
        <div class="box" id="sec">00</div>
    </div>
    <script src="script.js"></script>
</body>
</html>


css code:

body {
    background-color: black;
    display: flex;
    justify-content: center;
}

.container {
    width: 80%;
    height: 25vh;
    display: flex;
    justify-content: space-around;
    align-items: center;
    border: 8px solid yellowgreen;
    margin-top: 20vh;
}

.box {
    width: 20vh;
    height: 20vh;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12vh;
}


javascript code :


var sec=document.getElementById("sec");
var min=document.getElementById("min");
var hour=document.getElementById("hour");


var myfunc= setInterval(function(){
    timer1();
},1000);

function timer1(){
    var d=new Date();
    sec.innerHTML=d.getSeconds();
    min.innerHTML=d.getMinutes();
    hour.innerHTML=d.getHours();
}

NextGen Digital Welcome to WhatsApp chat
Howdy! How can we help you today?
Type here...