Open savybrandt opened 2 years ago
Hello, I'm working on a project that includes a full screen slide show. The HTML for the slideshow looks like this:
<ul id="slideshow"> <li id="slide-1"></li> <li id="slide-2"></li> <li id="slide-3"></li> <li id="slide-4"></li> </ul>
and I have scenes for the scroll-jacking behavior going forward and reverse for each slide transition, which looks something like this:
// slide 1 -> 2 scrolling down new ScrollMagic.Scene({ triggerElement: 'slide-2', triggerHook: 0, offset: 20, }).addTo(ScrollControll) .on('start', ({ scrollDirection }) => { if (scrollDirection === 'FORWARD') { gsap.to('#slideshow', { duration: 1, scrollTo: '#slide-2' }); } }); // slide 2 -> 1 scrolling up new ScrollMagic.Scene({ triggerElement: '#slide-1', triggerHook: 0, offset: $('#slide-1').height() - 20, }).addTo(ScrollControll) .on('start', ({ scrollDirection }) => { if (scrollDirection === 'REVERSE') { gsap.to('#slideshow', { duration: 1, scrollTo: '#slide-1' }); } });
My issue is that scrollDirection seems to always be "FORWARD" regardless what direction I'm scrolling. See video of console logs tied with the actual scroll event-
scrollDirection
"FORWARD"
https://user-images.githubusercontent.com/61570254/173114679-81c74061-ca7f-4a5c-a23d-e14fc4a96c24.mov
This same approach has worked for me when detecting scroll of the window. I wonder if it has to do with detecting scroll in the slideshow container?
Any advise would be helpful, or if this is just a known bug, I can take everything out of the container and scroll the window instead. Thanks!
Did you solve it?
Hey, I would like to work on this issue. please assign this to me.
Hello, I'm working on a project that includes a full screen slide show. The HTML for the slideshow looks like this:
and I have scenes for the scroll-jacking behavior going forward and reverse for each slide transition, which looks something like this:
My issue is that
scrollDirection
seems to always be"FORWARD"
regardless what direction I'm scrolling. See video of console logs tied with the actual scroll event-https://user-images.githubusercontent.com/61570254/173114679-81c74061-ca7f-4a5c-a23d-e14fc4a96c24.mov
This same approach has worked for me when detecting scroll of the window. I wonder if it has to do with detecting scroll in the slideshow container?
Any advise would be helpful, or if this is just a known bug, I can take everything out of the container and scroll the window instead. Thanks!