Scribd Logo
Upload

Welcome to Scribd!

  • Clock Project

    Uploaded by

    shivam narwade
    21 views2 pages
    This document contains code for a digital clock. The code uses JavaScript to get the current date and time, formats the hours, minutes and seconds with leading zeros, and displays either AM or PM. It displays the time in a <div> element with id="clock" centered on the page. The clock updates every second by calling the clock function again with setInterval.

    Original Description:

    Original Title

    clock project

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    This document contains code for a digital clock. The code uses JavaScript to get the current date and time, formats the hours, minutes and seconds with leading zeros, and displays either AM or PM. It displays the time in a <div> element with id="clock" centered on the page. The clock updates every second by calling the clock function again with setInterval.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    21 views2 pages

    Clock Project

    Uploaded by

    shivam narwade
    This document contains code for a digital clock. The code uses JavaScript to get the current date and time, formats the hours, minutes and seconds with leading zeros, and displays either AM or PM. It displays the time in a <div> element with id="clock" centered on the page. The clock updates every second by calling the clock function again with setInterval.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    of 2

    <!

    DOCTYPE html>
    <html lang="en">

    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=, initial-scale=">
    <title>Clock</title>
    <div ></div>
    <h1 align="center">Government Ploytechnic Hingoli</h1>

    <style>
    body {
    align-content: center;
    margin: auto;
    padding: auto;
    box-sizing: border-box;
    font-family: "Lato", sans-serif;
    font-style: italic;
    background: #14080e;
    background-color: aliceblue;
    scroll-behavior: auto;
    width: 1200px;
    border: 20px solid black;
    padding: 25px;
    margin: 25px;
    }
    #clock {
    height: 100vh;
    width: 100%;
    background-color: white;
    color: black;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 100px;
    font-style: Monospace;
    background-size: cover;
    }
    </style>
    </head>

    <body>
    <div id="clock">
    </div>
    <script>
    function clock() {
    let date = new Date();
    let hrs = date.getHours();
    let mins = date.getMinutes();
    let secs = date.getSeconds();
    let period = "AM";
    if (hrs == 0) hrs = 12;
    if (hrs > 12) {
    hrs = hrs - 12;
    period = "PM";
    }
    hrs = hrs < 10 ? `0${hrs}` : hrs;
    mins = mins < 10 ? `0${mins}` : mins;
    secs = secs < 10 ? `0${secs}` : secs;
    let time = `${hrs}:${mins}:${secs} ${period}`;
    setInterval(clock, 1000);
    document.getElementById("clock").innerText = time;
    }
    clock();

    </script>
    </body>

    </html>

    You might also like