Как сделать, чтобы кнопка «Далее» и «Предыдущая» не работали после того, как я достиг последнего и первого слайда соответственно?

Question

У меня проблема с слайд-шоу. Я использую javascript из w3.js и мне интересно, что добавить в код, чтобы кнопки не работали на последнем и первом слайде. Я искал много примеров, но ни один из них не помог мне.

JS

w3.slideshow = function (sel, ms, func) {
    var i, ss, x = w3.getElements(sel),
        l = x.length;
    infinite: false;
    ss = {};
    ss.current = 1;
    ss.x = x;
    ss.ondisplaychange = func;
    if (!isNaN(ms) || ms == 0) {
        ss.milliseconds = ms;
    } else {
        ss.milliseconds = 1000;
    }
    ss.start = function () {
        ss.display(ss.current)
        if (ss.ondisplaychange) {
            ss.ondisplaychange();
        }
        if (ss.milliseconds > 0) {
            window.clearTimeout(ss.timeout);
            ss.timeout = window.setTimeout(ss.next, ss.milliseconds);
        }
    };
    var clicks = 1;
    ss.next = function () {
        infinite: false;
        ss.current += 1;
        if (ss.current > ss.x.length) {
            ss.current = 1;
        }
        ss.start();
    };
    ss.previous = function () {
        infinite: false;
        ss.current -= 1;
        if (ss.current < 1) {
            ss.current = ss.x.length;
        }
        ss.start();
    };
    ss.display = function (n) {
        w3.styleElements(ss.x, "display", "none");
        w3.styleElement(ss.x[n - 1], "display", "block");
    }
    ss.start();
    return ss;
};

HTML

<div class="note">
    <h1>4Nadpis elearningu</h1>
    <p>4Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare ut sem at lobortis. Integer mattis venenatis enim eget semper. Integer finibus, augue a venenatis consequat, odio purus porta odio, in lobortis velit libero eget nunc. Nunc purus nisi, mollis ac facilisis sed, varius ut ipsum. Donec elementum sagittis elit, quis pellentesque risus lobortis vel. In et erat consequat, vestibulum felis et, luctus urna. Aliquam ipsum elit, varius fermentum rutrum eget, lobortis non purus. Nulla id nunc viverra nisi porttitor fermentum ut eu diam. In at vestibulum quam. Aenean non eros erat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare convallis lacus, vel dictum nibh convallis sed. Phasellus sem arcu, posuere id blandit ac, placerat dignissim erat. In congue lorem id vestibulum consequat. Proin feugiat ligula nec velit viverra commodo. Donec vitae maximus felis.</p>
</div>
<div class="note">
    <h1>5Nadpis elearningu</h1>
    <p>5Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ornare ut sem at lobortis. Integer mattis venenatis enim eget semper. Integer finibus, augue a venenatis consequat, odio purus porta odio, in lobortis velit libero eget nunc. Nunc purus nisi, mollis ac facilisis sed, varius ut ipsum. Donec elementum sagittis elit, quis pellentesque risus lobortis vel. In et erat consequat, vestibulum felis et, luctus urna. Aliquam ipsum elit, varius fermentum rutrum eget, lobortis non purus. Nulla id nunc viverra nisi porttitor fermentum ut eu diam. In at vestibulum quam. Aenean non eros erat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ornare convallis lacus, vel dictum nibh convallis sed. Phasellus sem arcu, posuere id blandit ac, placerat dignissim erat. In congue lorem id vestibulum consequat. Proin feugiat ligula nec velit viverra commodo. Donec vitae maximus felis.</p>
</div>
<br>
<button class="button" onclick="myShow.previous()">Naspat</button>
<button class="button" onclick="myShow.next()">Dalej</button>

<script>
    myShow = w3.slideshow(".note", 0);
</script>

Предполагается прекратить работу над последним слайдом (кнопка «Далее»), а также прекратить работу над первым слайдом (кнопка «Предыдущий»).

Answer 1

Следующая функция определяет, что должно произойти, если щелкнуть следующий элемент

  ss.next = function() {
    infinite: false;
    ss.current += 1;
    if (ss.current > ss.x.length) {ss.current = 1;}
    ss.start();
   };

Переменный ток отслеживает текущий слайд.Здесь он увеличивается на 1, а если он превышает количество изображений - x.length - он сбрасывается на 1.

Вместо того, чтобы автоматически увеличивать его, просто проверьте, является ли он последним элементом.и прекратить увеличение

  ss.next = function() {
    infinite: false;
    if (ss.current + 1 <= ss.x.length) {ss.current += 1;}
    ss.start();
   };

Аналогично предыдущей функции.Проверьте, приведет ли уменьшение на 1 к значению, большему 0, и к уменьшению регистра.

  ss.previous = function() {
    infinite: false;
    if (ss.current-1 > 0) {ss.current -= 1;}
    ss.start();
  };