Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make slidesPerView: 'auto' compatible with virtual slides mode. #7796

Open
3 of 4 tasks
ahimik opened this issue Nov 17, 2024 · 0 comments
Open
3 of 4 tasks

Make slidesPerView: 'auto' compatible with virtual slides mode. #7796

ahimik opened this issue Nov 17, 2024 · 0 comments

Comments

@ahimik
Copy link

ahimik commented Nov 17, 2024

Clear and concise description of the problem

We are currently using slidesPerView: 'auto' with predefined slide widths, which works perfectly for our UI requirements. This approach allows our layout to adapt seamlessly to varying screen sizes by automatically adjusting the number of visible slides based on their widths and the spacing between them.

However, we have more than 50 slides in our implementation, and to optimize performance, we would like to leverage the virtual slide rendering mode to dynamically load slides. Unfortunately, we’ve found that slidesPerView: 'auto' is not currently compatible with the virtual mode, as virtual rendering requires an exact number for slidesPerView. This limitation conflicts with our design, where slide widths and spacing may vary depending on the screen size.

Suggested solution

Simply allow specifying a fixed slide width using a slideWidth: number parameter. The number of visible slides could then be calculated by dividing the Swiper width by the specified slideWidth plus the gap. This enhancement would enable the combination of the slidesPerView: 'auto' option with the virtual: true rendering mode.

Alternative

No response

Additional context

No response

Validations

  • Follow our Code of Conduct
  • Read the docs.
  • Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

Would you like to open a PR for this feature?

  • I'm willing to open a PR
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant