Fade effect does not work with virtual slides. Strange behavior. - Githubissues

nolimits4web / swiper

Most modern mobile touch slider with hardware accelerated transitions

https://swiperjs.com

MIT License

39.56k stars 9.75k forks source link

Fade effect does not work with virtual slides. Strange behavior. #7730

Open barrakuda099 opened 1 week ago

barrakuda099 commented 1 week ago

Check that this is really a bug

[X] I confirm

Reproduction link

https://codesandbox.io/p/devbox/swiper-vue-effect-fade-forked-tclghq

Bug description

Fade effect does not work correctly with virtual slides. Several problems: 1) Open link and try to go next slide a couple of times. You will see following:

First click on next slide button (slide occurs with transition effect)
Second click on next slide button (slide occurs immediately without transition and after that transition occurs for next slide) 2) In case swiper has "loop" flag, second slide does not shown at all (white screen). To reproduce you need to go click next slide button until slide is not visible (on the second circle you will see that slide 2 is empty)

Expected Behavior

No response

Actual Behavior

No response

Swiper version

11.1.12

Platform/Target and Browser Versions

Chrome

Validations

[X] Follow our Code of Conduct
[X] Read the docs.
[X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
[X] Make sure this is a Swiper issue and not a framework-specific issue

Would you like to open a PR for this bug?

[ ] I'm willing to open a PR

nolimits4web commented 6 days ago

t0ggles-create swiper

t0ggles[bot] commented 6 days ago

Task nolimits4web/SWIPER-151 was created