-1

I want to create a js analog clock, but it doesn't work. Help me please When entering the file in the browser, the hands do not show any movement and they do not even show the time hands. When loading the file in the browser, the hands do not show any movement and do not even show the time hands. When I enter the inspector, it shows and says several errors """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""" Uncaught TypeError: hr is null file:///C:/Users/ ---- /OneDrive/Desktop/index.html:19 """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""" Or """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""" Uncaught TypeError: document.hr is undefined file:///C:/Users/ ---- /OneDrive/Desktop/index.html:19 """"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""

These are the codes

<!DOCTYPE html>
<html lang="fa">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        let hr = document.querySelector('#hrs');
        let mn = document.querySelector('#min');
        let sc = document.querySelector('#sec');

        let date = new Date();
        let hh = date.getHours() * 30;
        let mm = date.getMinutes() * 6;
        let ss = date.getSeconds() * 6;

        document.hr.style.transform = 'rotate($(hh(mm/12))deg)'; // 19 line !important
        document.mm.style.transform = 'rotate($(mm)deg)';
        document.sc.style.transform = 'rotate($(ss)deg)';
    </script>
</head>

<body>
    <div class="clock">
        <div class="numbers">
            <div class="circle" style="--i:1;--clr:#04fc43;" id="sec"><i></i></div>
            <div class="circle" style="--i:2;--clr:#fee800;" id="min"><i></i></div>
            <div class="circle" style="--i:3;--clr:#ff2972;" id="hrs"><i></i></div>
            <span style="--n:0"><b>12</b></span>
            <span style="--n:1"><b>1</b></span>
            ...
            ...
            ...
        </div>
    </div>
</body>

</html>

The rotation of the hands

محمد جدیدیان
  • 1

0 Answers0