Skip to content

Commit 977a09f

Browse files
committed
Completed 2
1 parent 1ea5f63 commit 977a09f

File tree

1 file changed

+18
-19
lines changed

1 file changed

+18
-19
lines changed

02 - JS + CSS Clock/index-FINISHED.html

Lines changed: 18 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -69,30 +69,29 @@
6969
</style>
7070

7171
<script>
72-
const secondHand = document.querySelector('.second-hand');
73-
const minsHand = document.querySelector('.min-hand');
74-
const hourHand = document.querySelector('.hour-hand');
75-
7672
function setDate() {
7773
const now = new Date();
78-
74+
7975
const seconds = now.getSeconds();
80-
const secondsDegrees = ((seconds / 60) * 360) + 90;
81-
secondHand.style.transform = `rotate(${secondsDegrees}deg)`;
82-
83-
const mins = now.getMinutes();
84-
const minsDegrees = ((mins / 60) * 360) + 90;
85-
minsHand.style.transform = `rotate(${minsDegrees}deg)`;
86-
87-
const hour = now.getHours();
88-
const hourDegrees = ((mins / 12) * 360) + 90;
89-
hourHand.style.transform = `rotate(${hourDegrees}deg)`;
76+
console.log(seconds);
77+
const secElem = document.querySelector(".second-hand");
78+
var degree = 360/60*seconds+90;
79+
secElem.style.transform = `rotate(${degree}deg)`;
80+
81+
const min = now.getMinutes();
82+
const minElem = document.querySelector(".min-hand");
83+
var degree = 360/60*min+90;
84+
minElem.style.transform = `rotate(${degree}deg)`;
85+
86+
const hours = now.getHours();
87+
console.log(hours);
88+
const hourElem = document.querySelector(".hour-hand");
89+
var degree = 360/12*hours+90;
90+
hourElem.style.transform = `rotate(${degree}deg)`;
91+
9092
}
91-
93+
9294
setInterval(setDate, 1000);
93-
94-
setDate();
95-
9695
</script>
9796
</body>
9897
</html>

0 commit comments

Comments
 (0)