Embedded Files
9 – 12h Teaching
Teacher:
- Hélène
Goals
Goals
- I stick to the good coding practices
- I know how to use the JavaScript Events
- I share my most inspiring resource with the class
- My Portfolio uses JavaScript (Hamburger Menu / Slideshow / Toggle Container)
Events
Events
- W3School
- Why we need events? ...anything that involves user interaction
- addEventListener()
Examples
Examples
- Javascript Practice 7 (Click Event)
- Javascript Practice 8 (Hamburger menu)
Research & Presentation
Research & Presentation
What resource (link / slide / example) was the most helpful or inspiring during the last two weeks? Do some research (15min).
Please present it to your colleagues (2-3min each).
Check out the Slack channel #lsn-students for all the links of your colleagues
12 - 13.30h Lunch
13.30 – 17h Coaching
Coaches:
- Stephen Band
- Lucas Donati
...First, finish the exercises
...First, finish the exercises
JavaScript Practice 3
JavaScript Practice 3
Use JavaScript to display the current day, date and time in the following format.
Sample Output :
Today is : Friday
Date: dd/mm/yyyy
Current time is : 2 PM : 32 : 10
Solution (View page source)
JavaScript Practice 4
JavaScript Practice 4
Use JavaScript to get the width and height of the window (any time the window is resized).
Solution (View page source)
JavaScript Practice 5
JavaScript Practice 5
- Create this result:
Use Array (list), loop and insert the values in <p></p>
Solution (View page source)
JavaScript Practice 6
JavaScript Practice 6
Generate many images!
- Create an Array of images and insert it in you HTML
- Set the width of you images to 20%
Solution (View page source)
...Then, Use Javascript on your portfolio
...Then, Use Javascript on your portfolio
Creation ideas:
- Hamburger menu
- Image slideshow
- Toggle container
- Change background-color depending the scroll or the window width
Report abuse