search

Emiliano-Bucci / react-spring-carousel-js

A new Carousel experience for the modern Web
https://react-spring-carousel-js.emilianobucci.com
80 stars 6 forks source link

Scroll up on next item #13

Closed ankitprahladsoni closed 3 years ago

ankitprahladsoni commented 3 years ago

I'm working on a carousel where every item has a lot of text and the user has to scroll down to read it. When the user swipes left or right to go to some other item, it doesn't scroll to the top. Is there any way in which the next or previous slide always scrolls to the top? PS: The items will be of variable lengths and I'm only targeting mobile devices.

Emiliano-Bucci commented 3 years ago

@ankitprahladsoni Hi!

I guess that you could listen for the onSlideStartChange event and manually scroll the scrollable container to the top. 

useListenToCustomEvent(event => {
    if (event.eventName === 'onSlideStartChange') {
      const scrollableContainer = document.querySelector('.scrollable-container')
      scrollableContainer.scrollTo(0, 0)
    }
  })

Something like that :)

Please let me know if that helps!

ankitprahladsoni commented 3 years ago

Yes, it does. However, I had to do window.scrollTo(0,0) inside useListenToCustomEvent. Thanks for the response