Another slideshow using the @container queries to allow the animation to be produced using transitions unstead of @keyframes.

This has the added feature of the play/pause icon which can be used to switch from automatic mode to manual mode. The image selection will work in both modes so there is no need to switch to manual mode to select another image.

I believe that CSS Play is the first website to use this method of controlling a slideshow.

This version has the ability to change the color of the arrows and buttons depending on the image shown. In this way you can always ensure that these icons are visible on any image.

If you want to use this slideshow in your website design please keep the copyright comment in the stylesheet and make a support donation. Every little helps in keeping this website going.