Is there a way to get the current visible components on the carousel?

[bhimeshchauhan]

Bugs and Questions

Prerequisites

Feel free to delete this section if you have checked off all of the following.

• [X] I've searched open issues to make sure I'm not opening a duplicate issue
• [X] I have read through the docs before asking a question
• [ ] I am using the latest version of nuka-carousel

Describe Your Environment

• What version of nuka-carousel are you using? - 4.4.6
• What version of React are you using? - 16.8.6
• What browser are you using? - Chrome

Describe the Problem

Is there a way to trigger an event for example exclusively on items visible on the carousel. I know there are identifiers to see which slides are available but can we get a reference to the child components currently visible in the carousel?

In other words can we get which components are currently visible, For example here following components are visible:

1 and 2

2 and 3

Additional Information

Any additional information, configuration or data that might be necessary to reproduce the issue.

[sarmeyer]

Hi @bhimeshchauhan thanks for the question - a slide-visible class is added to any carousel slide that is currently visible. If you're hoping to target currently visible slides, you could use that class to do so. I hope this answers your question

[allypalanzi]

I'm trying to also do something like this, and I noticed that the cellSpacing seems to also be factored in to if a slide receives the slide-visible class. So even when a slide is fully in-view, if it's margin is not, it will not receive the slide-visible class.

[bhimeshchauhan]

Hi @bhimeshchauhan thanks for the question - a slide-visible class is added to any carousel slide that is currently visible. If you're hoping to target currently visible slides, you could use that class to do so. I hope this answers your question

Hi, @sarmeyer I apologize for the late response. Your solution makes sense but this solution might not be very scalable in case we have multiple carousels on the same page. Having a reference to the children component at the very least would help.