[DivMan]

Сделал простой слайдер, если листать следующий слайдер, то показываются проценты (количество просмотреных слайдов) и отображается с глюками.

Если пролисать до последнего слайда, покажет 100% и если сделать шаг назад, то останется это же количество и если потом опять нажать вперёд, то покажет не все проценты, при просмотре всех слайдов.

И если промотать на первый слайд, то покажет 17%, а по идеи должно быть 0.

Я взял всё количество слайдов "allQuestion", узнал текущий слайд "openSlide.dataset.numberQuestion" и из этого посчитал проценты

<style>
    .next-question {
        border: 1px solid;
        margin-bottom: 20px;

        width: 400px;
        height: 400px;
        text-align: center;
        vertical-align: middle;
    }

    .open {
        display: block;
    }
</style>

<div></div>
<div style="" class="next-question open" data-number-question="1">
    Слайд 1             
</div>

<div style="display: none;" class="next-question" data-number-question="2">
    Слайд 2            
</div>

<div style="display: none;" class="next-question" data-number-question="3">
    Слайд 3            
</div>

<div style="display: none;" class="next-question" data-number-question="4">
    Слайд 4            
</div>

<div style="display: none;" class="next-question" data-number-question="5">
    Слайд 5            
</div>

<div style="display: none;" class="next-question" data-number-question="6">
    Слайд 6            
</div>
<div></div>


<button class="quiz-buttons__button_prev">Назад</button>
<button class="quiz-buttons__button_next-text">Вперёд</button>
<br><br>
<span class="percent">0%</span> <span>просмотрено</span>



<script>

    var allQuestion = document.querySelectorAll('.next-question');
    var percent = document.querySelector('.percent');
    var nextQuestion = document.querySelector('.quiz-buttons__button_next-text');
    var prevQuestion = document.querySelector('.quiz-buttons__button_prev');

    var allQuestion = document.querySelectorAll('.next-question');
    
    function closeQuestion() {
        allQuestion.forEach(function (question, i) {
            question.style.display = 'none';
        })
    }

    function openClose(element) {
        var openSlide = document.querySelector('.open');
        if (element == 'nextElementSibling') {
            var nextElement = openSlide.nextElementSibling;
        } else {
            var nextElement = openSlide.previousElementSibling;
        }
        
        
        //проценты
        percent.innerHTML = (openSlide.dataset.numberQuestion / allQuestion.length * 100).toFixed() + '%';

        numberQuestion = openSlide.dataset.numberQuestion;
        
        if (nextElement.hasAttribute('data-number-question')) {
            closeQuestion();

            openSlide.classList.remove('open');
            nextElement.style.display = 'block';
            nextElement.classList.add('open');
        }



    }


    nextQuestion.addEventListener('click', function (e) {
        openClose('nextElementSibling');
    });


    prevQuestion.addEventListener('click', function (e) {
        openClose('previousElementSibling');
    });
</script>