DEV Community

Cover image for How to Change Swipe Direction in Swiper.js (Horizontal & Vertical Guide)
Minah Mmassy
Minah Mmassy

Posted on

How to Change Swipe Direction in Swiper.js (Horizontal & Vertical Guide)

When I first started using Swiper.js in my React projects, I was playing a “guess the swipe direction” lottery. From left to right? From right to left? Up? Down? I didn’t want a random slide shuffle; I wanted complete control. So, to get Swiper to move the way I wanted it to, I looked into reverseDirection from the autoplay module.

The reverseDirection option in the autoplay module controls the direction of automatic sliding.

Default (false) → Slides move forward (left to right or up to down).
Enabled (true) → Slides move in reverse (right to left or down to up).
Now, follow along with me as I provide complete code snippets step-by-step, with Tailwind CSS styling, and no guessing 😎.
Full article here

Top comments (0)