जावास्क्रिप्ट में तीरों के साथ टेक्स्ट स्लाइडर

आइए अब तीरों के साथ एक टेक्स्ट स्लाइडर बनाएं। इसका मतलब है कि टेक्स्ट टाइमर के अनुसार नहीं, बल्कि एक तीर पर क्लिक करने पर बदलेगा। आइए अपने HTML कोड में तीर जोड़ें:

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

इस स्लाइडर के समाधान की मुख्य बारीकियाँ यह है कि टेक्स्ट की काउंटर वेरिएबल हमारे तीरों के क्लिक हैंडलर के लिए सामान्य होनी चाहिए:

javascriptlet i = 0; // बाहरी वेरिएबल

left.addEventListener('click', function() {
  // i को 1 से घटाएं
  // और i नंबर वाला टेक्स्ट दिखाएं
});
right.addEventListener('click', function() {
  // i को 1 से बढ़ाएं
  // और i नंबर वाला टेक्स्ट दिखाएं
});

और दूसरी बारीकियाँ यह है कि i को घटाने पर, या बढ़ाने पर, शून्य से कम और सरणी के अंतिम तत्व से अधिक संख्याओं में नहीं जा सकते।