Multi Step Progress Bar in HTML CSS & JavaScript

In this video you will learn How to create Multi Step Progress Bar in HTML CSS & JavaScript. This type of progressing bar is used in login or registration form.
---
📁 Source codes will be available here soon
➤ www.codinglabweb.com
Follow me on Instagram
➤ / coding.np
---
⌚ Timestamps:
00:00 Multi Step Progress Bar Demo
00:51 File Structure
01:12 HTML Code for Multistep Progress Bar
01:40 CSS code for Multistep Progress Bar
05:44 Creating Progress Bar
07:00 Creating Buttons
10:26 JavaScript code for Multistep Progress Bar
19:05 Final Result of Multistep Progress Bar
#multistep #progressbar #html_css_javascript z
---
Music Credit:
Deep Sea by Vendredi / vendrediduo
Creative Commons - Attribution 3.0 Unported - CC BY 3.0
Free Download / Stream: bit.ly/-deep-sea
Music promoted by Audio Library • Deep Sea - Vendredi (N...
Ikson - We Are Free (Vlog No Copyright Music)
• Ikson - We Are Free (V...
Song: Ehrling - You And Me (Vlog No Copyright Music)
➤ Video Link: • Ehrling - You And Me (...

Пікірлер: 47

  • @user-zs8rx1xu5e
    @user-zs8rx1xu5e Жыл бұрын

    Goodddddddddddd!!! Thank you so much ^^

  • @UAng-ro9kt
    @UAng-ro9kt10 ай бұрын

    Very nice!

  • @foo9848
    @foo9848 Жыл бұрын

    thank you!😀

  • @valarvijay7315
    @valarvijay7315 Жыл бұрын

    nice one..

  • @eMebyMonicaMateu
    @eMebyMonicaMateu Жыл бұрын

    love ur music XD

  • @jinkaicai3330
    @jinkaicai3330 Жыл бұрын

    厉害实用的 css

  • @mdms4549
    @mdms4549 Жыл бұрын

    its' Awesome your job🙂🙂

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Thank you so much 😀

  • @codingasmr
    @codingasmr Жыл бұрын

    Nice design 👌

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Thank you so much

  • @sanjivrai.
    @sanjivrai. Жыл бұрын

    👌

  • @nika8628
    @nika8628 Жыл бұрын

    thank you sir❤❤❤

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Most welcome

  • @shadowuser1979
    @shadowuser1979 Жыл бұрын

    Really cool. Can I implement the code in my website? Is there a license and or contribution mention (if so, where)? I have unfortunately found nothing on your website about that

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    You use. It's free.

  • @naveedwasee
    @naveedwasee Жыл бұрын

    Nice

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Most welcome

  • @paws7983
    @paws7983 Жыл бұрын

    NICEEEEE!

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Thanks a million.

  • @JS_Dev
    @JS_Dev Жыл бұрын

    nice👍

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Thank you! Cheers!

  • @JS_Dev

    @JS_Dev

    Жыл бұрын

    @@CodingLabYT 😃

  • @sanketsingh5555
    @sanketsingh5555 Жыл бұрын

    Same thing wd form 🔥

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Sure I will make on this topic.

  • @honghao1354
    @honghao135410 ай бұрын

    Hello if i want to keep the result after refreshing the page what should i add?

  • @user-lm5tz8hl8v

    @user-lm5tz8hl8v

    6 ай бұрын

    use local storage

  • @ashishpatel6078
    @ashishpatel6078 Жыл бұрын

    Sir can you please make a video on how to make slideable mobile menu just like linkedin mobile menu when we slide left then it gone leftside out of the screen Thank you so much sir 🙂

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    I will think on this topic.

  • @ashishpatel6078

    @ashishpatel6078

    Жыл бұрын

    @@CodingLabYT Please make sir 😅,

  • @alancito98
    @alancito986 ай бұрын

    you're webpage is broken i dont have addblocker and still asking my for allow add

  • @ozgureren8925
    @ozgureren8925 Жыл бұрын

  • @juni0rGTX
    @juni0rGTX Жыл бұрын

    Can numbers be replaced with icons?

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Yes. I will make a separate video on it. stay tuned.

  • @iamjoymaiti
    @iamjoymaiti Жыл бұрын

    Sir, image selling website aap banaye HTML CSS JavaScript and PHP mein full course 🙏🙏🙏🙏

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Okey I will think on this topic

  • @iamjoymaiti

    @iamjoymaiti

    Жыл бұрын

    @@CodingLabYT okay

  • @user-30Veer
    @user-30Veer Жыл бұрын

    How to make When step 1 completed it shows tick mark

  • @EnglishWithSushma

    @EnglishWithSushma

    Жыл бұрын

    We can replace the text with a tick mark... After completion of first step.

  • @valarvijay7315
    @valarvijay7315 Жыл бұрын

    can u anyone explain, why I can't access ${} this in my VS code..

  • @ACEmmanuel

    @ACEmmanuel

    4 ай бұрын

    Because you didn't use `backtick`

  • Жыл бұрын

    Now let's create a multi-step form !

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Okey stay tuned

  • @c26pragyanbhardwaj93
    @c26pragyanbhardwaj93 Жыл бұрын

    Tutorials of javascript

  • @CodingLabYT

    @CodingLabYT

    Жыл бұрын

    Here is the playlist - kzread.info/head/PLImJ3umGjxdAuARwziklrT2QEELizOMtr

  • @marcos17937
    @marcos179376 ай бұрын

    This js code is not working now

  • @lifefacts908
    @lifefacts9085 ай бұрын

    Ap khud sy logic kesy bnaty hein mn too jo chz open kro logic ki smjh ni ati k khud sy ye chz kesy build hogi dekhy bgair ni kr skti koi tip hi dy dein ap