Basic Swiper
The .default-swiper class creates a basic,
touch-enabled slider for smooth content transitions in
Swiper.
Navigation & Pagination Swiper
The .navigation-swiper class adds navigation
arrows and pagination dots to the Swiper, enabling easy
slide control and tracking.
Pagination Dynamic Swiper
The .pagination-dynamic-swiper class adds
dynamic pagination to Swiper, updating the visible dots as
you swipe through slides.
Pagination Fraction Swiper
The .pagination-fraction-swiper class adds
fraction-style pagination to Swiper, displaying the current
slide number over the total number of slides.
Pagination Progress Swiper
The .pagination-progress-swiper class adds a
progress bar-style pagination to Swiper, showing the current
slide's progress as you navigate through the slides.
Scrollbar Swiper
The .pagination-scrollbar-swiper class adds a
draggable scrollbar to Swiper, allowing users to scroll
through the slides smoothly.
Vertical Swiper
The .vertical-swiper class creates a Swiper
with vertical slide transitions, allowing users to swipe up
and down between slides.
Mousewheel Control Swiper
The .mousewheel-control-swiper class enables
Swiper control through the mousewheel, allowing users to
scroll slides using their mouse.
Effect Fade Swiper
The effect-fade-swiper class creates a smooth
fading transition between slides, enhancing the visual
experience when navigating through the content.
Effect Creative Swiper
The effect-creative-swiper class showcases a
unique slide transition effect, adding a dynamic touch as
slides creatively shift into view, making your content
visually engaging.
Effect Flip Swiper
The effect-flip-swiper class provides a 3D flip
animation for slide transitions, creating an eye-catching
visual effect as slides rotate into place, enhancing user
interaction.
Zoom Effect Swiper
The zoom-effect-swiper class allows slides to
zoom in and out during transitions, offering a dynamic and
engaging visual experience as users navigate through the
content.
Parallax Swiper
The parallax-swiper class creates a parallax
scrolling effect, where the background moves at a different
speed than the foreground, enhancing the depth and immersion
of the swiper content.
Thumbs gallery
The .thumb-view-swiper class is used for a
thumbnail gallery where small images below the main swiper
allow users to select and view larger versions. The
.thumbs-swiper class links the thumbnail view
with the main image display, enhancing the browsing
experience.