You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
33 lines
825 B
33 lines
825 B
Morning Exercise 12-05
|
|
|
|
#### Learning Objectives
|
|
- Practice using jQuery to manipulate the DOM
|
|
- Practice using JavaScript Timers
|
|
- Practice using internal JavaScript Objects
|
|
|
|
# Make a working virtual clock
|
|
|
|
Today you are going to build a clock!
|
|
|
|
Start by planning! Draw a clock, break down the problem.
|
|
|
|
### Step 1
|
|
Define 3 variables and grab the associated element from the DOM using jQuery:
|
|
- minuteHand
|
|
- secondHand
|
|
- hourHand
|
|
|
|
### Step 2
|
|
- Using setInterval and jQuery make the second hand do a full rotation in 60 seconds.
|
|
- You will have to utilize the css attribute `transform - rotate`.
|
|
|
|
### Step 3
|
|
- Make the minute hand do a full rotation in 1 hour
|
|
|
|
### Step 4
|
|
- Make the hour hand do a full rotation in 12 hours
|
|
|
|
### BONUS
|
|
- Sync up your clock with the current time.
|
|
- Take a look at the JavaScript `Date` object
|