1. The conditional expressiong is missing: // Make the buttons untargetable if (targetIndex === 0) { prevBtn.classList.add('cant-click'); nextBtn.classList.remove('cant-click'); } else if (targetIndex === slides.length) { // error was here prevBtn.classList.remove('cant-click'); nextBtn.classList.add('cant-click'); } else { prevBtn.classList.remove('cant-click'); nextBtn.classList.remove('cant-click'); }
@codyhillauthorMay 22.2019 — #@Sempervivum#1603937 I didn't understood what was saying there but I tried this and it still not working. const showHideArrow = (targetIndex, prevBtn, nextBtn, slides) => { // Make the buttons untargetable if (targetIndex === 0) { prevBtn.classList.add('cant-click'); nextBtn.classList.remove('cant-click'); } else if (targetIndex === slides.length -1) { prevBtn.classList.remove('cant-click'); nextBtn.classList.add('cant-click'); } else { prevBtn.classList.remove('cant-click'); nextBtn.classList.remove('cant-click'); } }
And then I call it to the next button and I add this const const nextIndex = slides.findIndex(slide => slides === nextSlide);
this is how I called it showHideArrow(nextIndex, prevBtn, nextBtn, slides);
@SempervivumMay 22.2019 — #As you already converted the nodelist to an array you can easily get the index of the next slide by indexOf() const targetIndex = slides.indexOf(targetSlide); I implemented it like this and it works:
@codyhillauthorMay 22.2019 — #@Sempervivum#1603943 Jeez men , you are a magician ! . Some time coding is so hard xd , specially when you don't know what you are doing .