In this video, we will create blog reader timeline which helps users while reading blogs and keep engaging in reading on the website. we will use HTML CSS and JavaScript for creating the timeline.
Source Code: https://codepen.io/rsk_2002/pen/bGvdvbP
Timeline:
0:38 HTML (creating a simple blog layout with timeline)
2:04 CSS (design the blogpost and reader timeline )
6:36 JavaScript (configure how to change the width while scrolling )
11:57 Find total Height to scroll
14:20 create width in percentage using (template literal) javascript
16:08 resolve CSS mistake ( *progress-div to progress-bar)
17:00 Outro and Final Result
Comment on what should I improve in coming videos?
New topic suggestions are welcomed.
Thank You!! ❤
Source Code: https://codepen.io/rsk_2002/pen/bGvdvbP
Timeline:
0:38 HTML (creating a simple blog layout with timeline)
2:04 CSS (design the blogpost and reader timeline )
6:36 JavaScript (configure how to change the width while scrolling )
11:57 Find total Height to scroll
14:20 create width in percentage using (template literal) javascript
16:08 resolve CSS mistake ( *progress-div to progress-bar)
17:00 Outro and Final Result
Comment on what should I improve in coming videos?
New topic suggestions are welcomed.
Thank You!! ❤
- Category
- Web design
Be the first to comment