Left Right Buttons not working

[Hsay28]

Here is my code

const [currentImageIndex, setCurrentIndex] = useState(0);

const gotoPrevious = () => currentImageIndex > 0 && setCurrentIndex(currentImageIndex - 1);

const gotoNext = (GalleryImages: any) => { console.log(currentImageIndex); currentImageIndex + 1 < GalleryImages.length && setCurrentIndex(currentImageIndex + 1); };

<Lightbox isOpen={true} className="bg-black/70" onClose={() => setIsLightboxView(false)} onNext={() => gotoNext(GalleryImages)} onPrev={gotoPrevious} singleClickToZoom images={GalleryImages.map((photo: any) => ({ src: photo.src, alt: photo.alt, }))} currentIndex={currentImageIndex} renderPrevButton={() => ( <IoIosArrowBack className={text-5xl text-primary absolute left-20 cursor-pointer} /> )} renderNextButton={() => ( <IoIosArrowForward className={text-5xl text-primary absolute right-20 cursor-pointer} />

[tim-soft]

could you make a codesandbox?

[paulopgss]

I really liked the lib, very easy to apply everything. So I will answer you because I went through the same problem, although I believe that by the time you must have already changed the lib or done something without the aid of a lib. The fact is that the z-index of the image is on the button, so you can not apply, check your css if you still use the lib that should already solve. Applying a z-index of 2 on the buttons worked for me. I hope I have helped and if other people go through the problem can consult this issue