Carousel slider tutorial with HTML, CSS, JavaScript
In this video we make a simple carousel slider with HTML, CSS and JavaScript. The video is split into 3 main segments:
1. making the carousel functionality with HTML, CSS and JavaScript
2. making the carousel accessible
3. discussing different ways to test the carousel
Chapters:
0:00 Intro
0:32 HTML
7:05 CSS
18:35 JavaScript
19:38 Changing carousel button from div to button
20:47 More JavaScript
42:42 Handling multiple carousels on the page
54:08 Adding some nicer slides
56:33 Handling accessibility
1:17:28 Additional note about aria-live
1:18:28 Testing
1:26:49 Outro
Video links:
Article version of this video: https://programmingduck.com/articles/...
GitHub repository: https://github.com/Programming-Duck/c...
Channel links:
Programming Duck website: https://programmingduck.com
Facebook: / programming-duck-100207231868555
Instagram: / programmingduck
Resources used in video:
Music:
Music provided by HearWeGo (https://goo.gl/nDS3zR)
Artist: MARION
Title: High Hopes
Listen on YouTube: • MARION - High Hopes
Intro screen: https://trendslogo.com/after-effects-...
Subscribe button template - https://trendslogo.com/youtube-subscr...
Outro screen: https://trendslogo.com/outro-template...
#programmingduck #programming #coding
