How to Create a Progress Bar WITH STAGES - HTML, CSS & JavaScript Tutorial
HTML-код
- Опубликовано: 9 янв 2022
- View the SOURCE CODE:
codepen.io/dcode-software/pen...
In today's video I'll show you how to create a working progress bar that shows stages (or "status updates") as it fills up. With this technique, you can display a status text for each part of your app as it loads up.
This solution uses HTML, CSS, JavaScript, CSS3 Transitions, and HTML5 Data Attributes.
🏫 My Udemy Courses - www.udemy.com/user/domenic-co...
🎨 Download my VS Code theme - marketplace.visualstudio.com/...
💜 Join my Discord Server - / discord
🐦 Find me on Twitter - / dcodeyt
💸 Support me on Patreon - / dcode
📰 Follow me on DEV Community - dev.to/dcodeyt
📹 Join this channel to get access to perks - / @dcode-software
If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!
#dcode #css #javascript
Hi Dom, thank you so much for creating such a wonderful videos! Your videos really helps me out to understand more in JavaScript.
Awesome 😁 you're welcome!
I find it very fitting that your name is Dom (: Thanks for the easy to follow tutorial
As soon as I saw this, I opened my Atom instance and started following along! Love the smooth animation, and great video!
Like this example, good job man
Super clear, very impressive.
Great small JS projects! Thanks man! :)
Hi Dom.
Awesome video! I’ve wanted to do this for a while. How can I get it to redirect when the progressing bar finishes?
Thanks
I saved alot of your videos..you are life changer.. 580 videos which i still need to see and practice
You're a legend thank you
@@dcode-software your Content is way to different and its what we need the most..ill keep this channel forever
Heya, so I've got it set to one value but can't get it to change in time to other stages... any tips?
Loved this video , just wanted to know how exactly the bar increases from 0 to 100% as you showed at the start of the video. Because in this video u gave a random value like 27 .Could you help me with the code to show its full working because I am new to the javascript
help us Dom
Hello, i wave some problem with the ".map(stage => stage.split(":"))" command line can you help me?
12:26
What if we change "value >= stage[0]" to "value
worth noticing - it's a fake loading bar