Skip to content

fix(core): use virtual slides count in onResize when virtual mode is enabled #8163

Merged
nolimits4web merged 2 commits intonolimits4web:masterfrom
shawn-mnoko:fix/virtual-onresize-slides-length
Feb 23, 2026
Merged

fix(core): use virtual slides count in onResize when virtual mode is enabled #8163
nolimits4web merged 2 commits intonolimits4web:masterfrom
shawn-mnoko:fix/virtual-onresize-slides-length

Conversation

@shawn-mnoko
Copy link
Copy Markdown
Contributor

Summary

Problem

When using Virtual mode with slidesPerView > 1, onResize() incorrectly uses swiper.slides.length (rendered
DOM elements, typically ~4-6) instead of the full virtual slides count (e.g., ~10). This causes slideTo() to
navigate to a wrong position when the swiper is at the end and a resize event occurs.

For example, with 10 virtual slides and slidesPerGroup: 2:

  • swiper.slides.length = 4 (DOM elements)
  • slideTo(3)snapIndex = Math.floor(3/2) = 1 → jumps to slide index 2
  • Expected: stay at the last slide (index 8)

Root cause

onResize() enters this branch when slidesPerView > 1 and isEnd === true:

// onResize() - BUG
if ((params.slidesPerView === 'auto' || params.slidesPerView > 1)
    && swiper.isEnd && !swiper.isBeginning
    && !swiper.params.centeredSlides && !isVirtualLoop) {
  swiper.slideTo(swiper.slides.length - 1, 0, false, true);
  //             ^^^^^^^^^^^^^^^^^^^^^^ DOM count (~4), not virtual count (~10)
}

The update() method already handles this correctly:

// update() - CORRECT
const slides = swiper.virtual && params.virtual.enabled ? swiper.virtual.slides : swiper.slides;
translated = swiper.slideTo(slides.length - 1, 0, false, true);

Fix

Apply the same virtual-aware pattern from update() to onResize():

+ const slides = isVirtual ? swiper.virtual.slides : swiper.slides;
- swiper.slideTo(swiper.slides.length - 1, 0, false, true);
+ swiper.slideTo(slides.length - 1, 0, false, true);

Note: isVirtual is already defined earlier in onResize():
const isVirtual = swiper.virtual && swiper.params.virtual.enabled;

@nolimits4web nolimits4web merged commit 4400083 into nolimits4web:master Feb 23, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants