JavaScript-də oxlar ilə mətn slideri

Gəlin indi oxlar ilə mətn slideri edək. Bu o deməkdir ki, mətn taymerlə deyil, oxa klikləməklə dəyişəcək. Gəlin HTML kodumuza oxlar əlavə edək:

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

Bu sliderin həllində əsas incəlik ondadır ki, mətnlər üçün sayğç dəyişəni oxlarımızın klik handlerləri üçün ümumi olmalıdır:

javascriptlet i = 0; // xarici dəyişən

left.addEventListener('click', function() {
  // i-ni 1 vahid azaldırıq
  // və i nömrəli mətni çıxardırıq
});
right.addEventListener('click', function() {
  // i-ni 1 vahid artırırıq
  // və i nömrəli mətni çıxardırıq
});

İkinci incəlik isə ondadır ki, həm i azaldılanda, həm də artırılanda, sıfırdan kiçik və massivin son elementindən böyük ədədlərə çıxmaq olmaz.

Задание 1

Təsvir olunan slideri həyata keçirin. Elə edin ki, mətnlər dairəvi şəkildə dəyişsin.

Задание 2

Əvvəlki məsələni elə dəyişin ki, mətnlər dairəvi şəkildə dəyişməsin, sadəcə sonuncu sağ və ya sol vəziyyətə çatanda daha da sürüşməsin.