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.