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

Focus center with trimspace false not working correctly when showing slider on click #1284

Open
2 tasks done
samuelreichor opened this issue Mar 4, 2024 · 1 comment
Open
2 tasks done
Labels
bug Something isn't working

Comments

@samuelreichor
Copy link

Checks

Version

v4.1.4

Description

Hello,

I'm working on a feature where a slider opens within a modal upon clicking. This modal is configured with the trimspace option set to false and focus centered. I've noticed that when the slider isn't present on the initial page load, the translateX values for splide__list don't get calculated correctly.

I understand that I could circumvent this issue by using a custom modal, but I'd prefer to utilize the native dialog element, which doesn't allow for this workaround.

Interestingly, when I resize the window, an event listener triggers and everything functions as expected. Is there something I can trigger when opening the modal as a quick fix? Alternatively, could you investigate this issue and provide a solution?

Reproduction Link

https://codepen.io/samuelreichor/pen/KKYpzBx

Steps to Reproduce

  1. Go to reproduction Link
  2. click the buttons

Expected Behaviour

The translatex should get calculated correctly.

@samuelreichor samuelreichor added the bug Something isn't working label Mar 4, 2024
@samuelreichor
Copy link
Author

Managed it to get it running by refreshing the slider with https://splidejs.com/guides/apis/#refresh every time when opening the modal :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant