Teksta slīders ar bultiņām JavaScript

Tagad izveidosim teksta slīderi ar bultiņām. Tas nozīmē, ka teksts mainīsies ne pēc taimera, bet noklikšķinot uz bultiņas. Pievienosim bultiņas mūsu HTML kodam:

html<a href="" id="left">←</a>
<a href="" id="right">→</a>
<div id="slider"></div>

Galvenā šī slīdera risinājuma smalkā detaļa ir tā, ka tekstu skaitītāja mainīgajam ir jābūt kopīgam mūsu bultiņu klikšķu apstrādātājiem:

javascriptlet i = 0; // ārējais mainīgais

left.addEventListener('click', function() {
  // samazina i par 1
  // un izvada tekstu ar numuru i
});
right.addEventListener('click', function() {
  // palielina i par 1
  // un izvada tekstu ar numuru i
});

Un otrā smalkā detaļa ir tā, ka, samazinot i vai palielinot, nevar izkļūt ārpus skaitļiem, kas mazāki par nulli un lielāki par pēdējo masīva elementu.