How to embed the previous and next image in the previous and next button in a carousel

Question

I am making a portfolio website, with a carousel to showcase my images. I have successfully coded the carousel to work. Now, I just have one obstacle: I want the 'Next' and 'Prev' button to show the next and previous image. What kind of javascript code, would I have to put inside of my code, in order for this to work? This image illustrates what I mean

Answer 1

Find whatever functions are being called for you normal carousel next and prev buttons and call them from your next and prev images by adding an onclick attribute to them in the html.

<img inclick="prevImage()" href="image1"
<!-- Main carousel image -->
<img onclick="nextImage()" href="image3">

You could then just swap the hrefs of the images. Alternatively, you could create an array of images and have a prev, current, and next classes. Style those using CSS and still onClick would just be updating the classes.

Some more detail could better guide a better response.