| 21 | }) |
| 22 | let idx; |
| 23 | function update(){ |
| 24 | circles.forEach((circle , idx) => { |
| 25 | if(idx < CurrentActive){ |
| 26 | circle.classList.add('active') |
| 27 | } |
| 28 | else{ |
| 29 | circle.classList.remove('active') |
| 30 | } |
| 31 | }) |
| 32 | const actives = document.querySelectorAll('.active') |
| 33 | progress.style.width = ((actives.length - 1)/(circles.length - 1))*100 + '%' |
| 34 | |
| 35 | |
| 36 | |
| 37 | if(CurrentActive == 1){ |
| 38 | prev.disabled = true; |
| 39 | } |
| 40 | else if(CurrentActive == circles.length){ |
| 41 | next.disabled = true; |
| 42 | } |
| 43 | else{ |
| 44 | next.disabled = false; |
| 45 | prev.disabled = false; |
| 46 | } |
| 47 | } |