2,194 questions
0
votes
0
answers
40
views
Swiper.js centeredSlides with loop not showing next slides on mobile
I'm using Swiper.js with centeredSlides: true and loop: true on mobile. I want the current slide centered and the previous/next slides partially visible (about 20% on each side).
Currently, the first ...
- 13
1
vote
1
answer
82
views
swiper.js w/ coverflow causing 'mouse' problems?
<html>
<head>
<style>
.swiper-slide {
width: 75px !important;
cursor: no-drop;
}
</style>
&...
- 53
1
vote
1
answer
44
views
How to preserve PicoCSS (form) styling inside Swiper <swiper-slide>?
Questions:
How to preserve PicoCSS (form) styling inside Swiper <swiper-slide>?
What is causing PicoCSS form styling to break inside Swiper <swiper-slide>?
The styles injected by Swiper ...
- 18k
1
vote
2
answers
210
views
Swiper slider with box shadow
I have a problem with SwiperJS slider - I would like to add for each item a box-shadow.
When I wrap it with swiper CSS classes then I can see that overflow is hidden and crop my shadow.
How can I ...
- 51
2
votes
0
answers
163
views
How to dynamically update the language direction (RTL / LTR)? [closed]
Problem
I'm using Swiper Element in an Angular component and I want to dynamically update the swiper's direction based on the current language ('ar' for RTL, 'en' for LTR) using a LangService.
The ...
- 386
0
votes
0
answers
58
views
Swiper slide is not taking the full width of the carousel, even when specified as show 1 slide
I'm trying to make my slides take up on the whole swiper, its not meant to show the prev and next slides, just one since its basically a Hero.
This is my current code, you will notice i try to ...
0
votes
0
answers
39
views
Disable warning in Drupal Swiper Formatter module
I’m using the Drupal module “Swiper formatter” to create my website Swiper. However, when the slides are fewer than required, Drupal displays a warning message:
"The number of slides is less than ...
- 53
1
vote
0
answers
157
views
Swiper.js Marquee/Ticker effect is not moving
I'm trying to build a Swiper Marquee/Ticker for a logo garden, but the I'm experiencing some issues, I cannot get the Swiper to actually start moving on its with AutoPlay. When I interact with the ...
0
votes
1
answer
68
views
Hide Non-Visible Slides + Make Responsive
I have a few things that I am trying to do with SwiperJS. You can see on my site here: http://newgl.greenlegion.com
ISSUE 1: i cannot figure out a way to see more of the slide on mobile. It's tough ...
- 718
-1
votes
1
answer
75
views
SwiperSlide components do not appear when the Swiper is being swiped
I just installed SwiperJs in my project and copied the code from the docs. But the images, that I'm supposed to swipe to see, are all hidden expect for the first one.
When I swipe, the content of the ...
- 351
1
vote
1
answer
76
views
SwiperJs not working properly when rendering it conditionally
In my angular application, I have 4 swiper slide, which i want to render conditionally. But its not working properly. I have added images as well at bottom.
Issue - On initial load all swiper are ...
- 25
0
votes
0
answers
83
views
Infinite looping Swiper.js "thumbnail" navigation?
Using modified version of swiper.js "thumbs" gallery and help from this codepen, I'm trying to get an infinitely looping menu/slide combination:
Here's what I have so far
// Assign some ...
1
vote
1
answer
34
views
Jumping spacebetwen when initialize
How i can solve this?
While the slider is initializing the slides have no spaces
and after initialization they appear and the result is an ugly jump
I tried to set additional indents via CSS as a ...
- 107
0
votes
1
answer
172
views
Swiper wont be centered
I made this slider using swiper, so the current slide should always look bigger than the rest, and be centered. Also the 10px margin between slides shold be kept.
But after running my code, the slides ...
- 1,811
0
votes
0
answers
108
views
How do I scroll a slide within a vertical slide and have it snap to the next slide and fade with Swiper.js?
As the title says, how do I scroll through a slide that has 500vh and then snap to the next slide and fade with Swiper.js?
https://codepen.io/Echo1017/pen/NPWrBGq?editors=1010
<!DOCTYPE html>
&...
- 1
0
votes
0
answers
47
views
Angular Swiper Only Shows One Slide Initially Before Loading Others
import { Component } from '@angular/core';
import { MatButtonToggleModule } from '@angular/material/button-toggle';
import { TmdbService } from '../../services/tmdb.service';
import { OnInit, ...
0
votes
0
answers
120
views
Mobile Video Play/Pause Toggle Not Working Reliably (SwiperJS Slider)
I'm using Swiper JS to create a slider of TikTok videos on my website. I've implemented a feature where users can click on the video itself to toggle between play and pause. This works perfectly on ...
- 1
1
vote
0
answers
300
views
Problem with swiper loading correctly in nextjs 15-swiper 11
next15
swiper11
tailwind 4
I used the swiper library but at the first moment of page loading it only shows one of the components and in the next second they all load.
Even if I want to put a loader ...
- 31
0
votes
2
answers
239
views
Swiper JS infinite height issue with NextJs
Swiper JS in nextjs and with "use client" doesn't calculate height properly. It looks like there is a calculation error and the height is calculated multiple times resulting in large height?
...
- 1,571
0
votes
0
answers
79
views
How to create interaction/event on swiper.slide using swiper.js
When clicking on the swiper.slide the image pops up, but it moves with the swiper instead of being fixed to screen like I want it to be.
Loom video explaining below
Webflow read only link: https://...
0
votes
3
answers
449
views
Navigation arrows are not showing
I've been trying to use Swiper js, it went well until I needed to use it 2 more times at different parts of the code, the problem is: the navigation arrows simply don't appear in the page and I can't ...
- 13
0
votes
0
answers
94
views
swiper-slide: How to create hover &/or click interaction so when swiper-slide is clicked on the image pops up larger
I can't seem to get only the swiper-slide that's clicked on to pop up. Instead all the images with the class pop up at once.
I have tried using webflow native interactions in interactions panel using ...
1
vote
1
answer
34
views
How to align Card(bootstrap) heights in SwiperSlide(swpier.js)
I'm trying to align the height of Card (bootstrap) in SwiperSlide (swpier.js) so that they have the same height, I tried several things but nothing worked.
<Container>
<Swiper
...
- 51
0
votes
0
answers
90
views
how to remove a slide in swiperjs with a transition
How can I combine a removeSlide with a transition? It would be great if I could do this with a fade out of the slide and a move together of the remaining slides.
swiper.removeSlide(slideNum);
No ...
- 1,345
1
vote
1
answer
176
views
Error in responsive breakpoints of swiper in react
I am trying to implement a swiper slider in React but the responsive breakdown is not working. I want in mobile devices the slider to have 2 slides but it is not working.
In the mobile devices it's ...
