Jump to content
GreenSock

kacpergalka

ShockinglyGreen
  • Posts

    2
  • Joined

  • Last visited

About kacpergalka

kacpergalka's Achievements

  1. Thank you! Killing the instance and reinitializing the ScrollSmoother did the job. I just wonder, don't you handle history events in a different manner? So users are able to get back to the previous page with the same scroll position, by using history back button and won't start with scrollTop position. I tried below, but for some reason, the scroll position is a little bit different than expected. if (typeof data.trigger == 'object') { Site.smoother.scrollTop(0); Site.smoother.kill(); } typeof data.trigger returns object, if the trigger was DOM element, and string, if it was history event.
  2. Hello, I can't make ScrollSmoother work with AJAX transitions using barba.js library. The problem is, that the ScrollSmoother isn't updating properly. It's not updating the content height, and the effects on new page won't apply. How should I approach it? Below are the basic functions I use, and the structure. I used it exactly the same with Locomotive Scroll, before I tried to move to GSAP solution. ScrollTrigger.refresh(); doesn't seem to do anything. I will appreciate your help. Thanks. <div id="site" data-barba="wrapper"> <div id="smooth-wrapper"> <div id="smooth-content"> <main data-barba="container"> <?php the_content(); ?> </main> </div> </div> </div> initScroll: () => { Site.smoother = ScrollSmoother.create({ wrapper: '#smooth-wrapper', content: '#smooth-content', smooth: 1.5, effects: true, smoothTouch: 0.1, }); }, initTransitions: () => { barba.init({ transitions: [ { name: 'default-transition', leave(data) { }, enter() { }, } ], }); barba.hooks.beforeLeave((data) => { }); barba.hooks.after((data) => { Site.reinit(); ScrollSmoother.scrollTop(0); ScrollTrigger.refresh(); }); },
×