Jump to content

Search In
  • More options...
Find results that contain...
Find results in...


  • Content Count

  • Joined

  • Last visited

Community Reputation

2 Newbie

About Inkblot

  • Rank
  1. After some more digging I've found that the following two lines we're causing the errors: ScrollTrigger.addEventListener('refresh', scroller.update) ScrollTrigger.refresh() Looking over the docs for ScrollTrigger, I added the true as a parameter to ScrollTrigger.refresh and it worked - there doesn't seem to be a similar way of doing things for LocomotiveScroll however, so I currently just catch the exception thrown: ScrollTrigger.addEventListener('refresh', () => { try { scroller.update() console.log("scroller updated") } catch { console.log("could
  2. So I would kill it with destroy(), or stop ? Do I also need to kill the ScrollTrigger?
  3. I've setup a codesandbox but I don't get the error in question ... the locomotive scroll also doesn't work and I'm really not sure what's gone wrong given that the same code works in codepen. However, my main issue is that where I create the LocomotiveScroll object I have to supply the DOM element which changes with each page and I think that's where the problem arises from because if I remove my code to setup the scrolling again on a route change, I no longer get the error. For reference: watch: { $route(to, from) { this.$nextTick(this.setScroll); }, }, Bu
  4. I've setup a Vue 3 codepen codepen which mirrors my structure, although, nothing seems to be happening in regards to the scrolling animation. Have I not set the CSS correctly? EDIT: It seems as if explicitly setting a height and/or overflow attribute disables the scrolling animation. That solves that but my previous reply was an error caused when switching pages, something I don't think I can really demonstrate in a codepen.
  5. Hey Zach, thanks for the warm welcome. I'd figured it was just a case of me not fully understanding the requirements haha. I've tried your solution but I've run into a bit of a problem that's preventing me from seeing if it's worked. The issues with the viewport are fixed but it seems the scrolling element I've defined doesn't change to the new one when going to different pages, meaning I get an error. It happens because my App component is only mounted once on the first load and isn't reloaded on a route change so the scroller method is only fired once. I tried to rem
  6. Newbie here, I'm using Vue (3.0) and I'm trying to get started with GSAP and Locomotive Scroll but ran into a couple of issues. I've tried using some sample code(bottom of post - mine is without the code to scroll images) to get smooth scrolling implemented but I've found that it adversely affects the layout of my page. A page is a div element, styled by: .full-page { min-width: 100%; width: 100%; min-height: 100vh; } So the structure of the application is: <html> <body> <div id="#app"> <div class="full-page"> ...