Demarcus Williams
Demarcus Williams

Reputation: 33

Keep getting a "cannot read property error

keep getting the error message "Uncaught TypeError: Cannot read property 'style' of null at setDate" not sure what im missing!!!

 <script>
        const secondHand = document.querySelector('.second-Hand');
        const minsHand = document.querySelector('.min-Hand');
        const hourHand = document.querySelector('.hour-Hand');

        function setDate(){
          const now = new Date();

          const seconds = now.getSeconds();
          const secondsDegrees = ((seconds / 60) * 360) + 90;
          secondHand.style.transform = rotate(`${secondsDegrees}deg`);
          console.log(seconds);

          const mins = now.getMinutes();
          const minsDegrees = ((seconds / 60) * 360) + 90;
          hourHand.style.transform = `rotate(${minsDegrees}deg)`
        }

        setInterval(setDate, 1000);

</script>

Upvotes: 0

Views: 100

Answers (1)

Denis Omerovic
Denis Omerovic

Reputation: 1440

Your querySelectors are probably wrong .second-Hand maybe should be .second-hand and your minutes are wrong, also backticks should goes like this:

secondHand.style.transform = `rotate(${secondsDegrees}deg)`;
const secondHand = document.querySelector('.second-hand');
const minsHand = document.querySelector('.min-hand');
const hourHand = document.querySelector('.hour-hand');

function setDate() {
  const now = new Date();

  const seconds = now.getSeconds();
  const secondsDegrees = ((seconds / 60) * 360) + 90;
  secondHand.style.transform = `rotate(${secondsDegrees}deg)`;

  const mins = now.getMinutes();
  const minsDegrees = ((mins / 60) * 360) + ((seconds/60)*6) + 90;
  minsHand.style.transform = `rotate(${minsDegrees}deg)`;
}

setInterval(setDate, 1000);

Upvotes: 2

Related Questions