Swipers & Slide Shows with Scroll Snap

An exploration of swipers and slide shows using modern browser features like CSS Scroll Snap

A Basic CSS Only Swiper using CSS Scroll Snap

This is a slide show in the sense that you can swipe but it won’t automatically move. With proper page indicators this is basically the Instagram post swiper.

FYI this basketball is really sick and actually for sale here: Syntax Basketball

What is this missing to become a slide show?

  • Working Page indicators
  • Forward Prev Buttons
  • Automatic
  • Events? (only if you need it)

A Swiper With Active Indicators

If we want indicators to show what slide we’re on, buttons and timing, we’ll need to add a bit of JavaScript. Let’s do it


Let’s Make A Simple Slideshow