I want to make a slider in which the progress bar/div slides into another div

Question

I have made this code but I want to make a slider so that each of the progress bar/div is seen only after clicking the next/prev button
https://code.sololearn.com/WF1keffgym4l/?ref=app

Answer 1

The solution is to wrap all the progress bars in a div and give them id of div1, div2, div3 respectively.
The to hide other div use display property of css
For example
#div1{
display: none;
}
It will hide that div

Now head over to JavaScript and look at my code Everytime you press next it will increase counter value and will display next and next divs.
You can also implement the back button using the reverse technique

Here is what you are looking for
https://code.sololearn.com/W0GpTYbEya6M/?ref=app

Answer 2

//to increase progress use id.value="50" you don't need to switch different types of progress and for text just make 1 div and place text by id.innerHTML,

https://code.sololearn.com/WziWguMQ37Yr/?ref=app

Answer 3

🐶Raj-Dog-Chhatrala☑️
Shudarshan Rai 👑
Check the code
https://code.sololearn.com/WIHeo7vCI0KP/?ref=app