Incorporating a slideshow into your Ceros experience allows you to show more content without requiring any user interaction or overcrowding the canvas. In this lesson, we are going to build out an image slideshow that automatically cycles through three different images.
- To start, select the first image and navigate to the Interact tab. Apply an interaction that says On View- Show- and choose the next image in the sequence, and apply a 3 second delay.
- With the first image still selected, apply a second interaction that says On View- Hide- and choose the first image (so it hides itself), also with a 3 second delay.
- On the second and third images in the sequence we are going to apply the same two interactions, showing the next image in the sequence and hiding the current image. We can continue applying a 3 second delay to each of these interactions as well to keep everything consistent.
- Make sure only the first image in the sequence has its visibility turned on so we only see one at a time.
- Select each image and apply an animation that says on view, fade in, and on hide, fade out, with the default settings applied.
Looking at the preview, you can see these images will cycle through automatically with some nice animations. Slideshows are a great way to showcase multiple images without adding clutter to your experience. If you would like users to be able to click through these images, rather than have them auto cycle, be sure to take a look at our other Ceros lesson around Carousels. If you have any questions or issues with this build, be sure to reach out in the chat widget, and we’ll be happy to help.