Hello,
I would like to have a single image change to a different image from a hidden collection of images based on the click of a button.
So for instance, a user clicks on a single button several times, each click brings up a new image from the hidden collection.
Can someone help me to figure out how to achieve this desired effect?
Here is my public share link: LINK
(how to access public share link)
Hello, It’s quite simple. Assume that we have two images, and you assign a different class name to each image. The layout of both images should be identical. You set the display of one image to ‘hidden’ and the other to ‘block’. On the interaction with the desired button click, you need to ensure that the image you want to display gets ‘display: block’, and the image you want to hide gets ‘display: hidden’. You can also repeat this process for any additional images you need by assigning separate classes.
Im afraid that this kind of setup will be PIN @zafremedia. I know that “no-code” is popular but not everything should be forced to do it this way as there are more reliable solutions than that.
What @Mosiah is asking for is just basic loop principle with each click increasing a number and when there is no higher number reset back to start. So from this description it is IMO basic carousel (or slider if you prefer) principle (with only one “arrow”) and for that is here on forum many solutions with simple custom code. 
m2c
Thank you both @zafremedia and @Stan ! I was able to accomplish what I needed via a slider component just as you suggested Stan, thank you so very much for your input!
Would you happen to have any suggestions for customizing the transition animation between images?
I do not know how you have implemented it. If you have used a WF slider there may be some tutorials online. I do not use WF slider at all. Otherwise it can be done with a custom code with help of Browser Dev Tools.
You can visit “Made with Webflow” where you may find some examples on slides transitions.
Have a good one
