Slider de text cu săgeți în JavaScript
Să facem acum un slider de text cu săgeți. Aceasta înseamnă că textul se va schimba nu prin timer, ci prin apăsarea pe săgeți. Să adăugăm săgeți în codul nostru HTML:
<a href="" id="left">←</a>
<a href="" id="right">→</a>
<div id="slider"></div>
Principalul detaliu subtil al acestui slider este că variabila contor pentru texte trebuie să fie comună pentru handler-ele de click ale săgeților noastre:
let i = 0; // variabilă externă
left.addEventListener('click', function() {
// micșorăm i cu 1
// și afișăm textul cu numărul i
});
right.addEventListener('click', function() {
// mărim i cu 1
// și afișăm textul cu numărul i
});
Iar al doilea detaliu subtil este că, atât la micșorarea
i, cât și la mărirea lui, nu putem ieși
în numere mai mici decât zero și mai mari decât ultimul element
din array.
Implementați sliderul descris. Faceți astfel încât textele să circule în cerc.
Modificați problema anterioară astfel încât textele să nu mai circule în cerc, ci pur și simplu să nu se mai deruleze dincolo de poziția extremă dreaptă sau stângă.