Jump to content
Search Community

Help with ScrollTrigger Smooth scroll + Vue JS (Gridsome)

Shahas Nizar test
Moderator Tag

Recommended Posts

Hi Everybody! I would like to share my problem.

I am using ScrollTrigger to smoothscroll and animate elements.
Earlier i used Locomotive Scroll + ScrollTrigger together but when i knew that ScrollTrigger alone can do both, i decided to ditch Locomotive Scroll.

I followed the following pen for using ScrollTrigger for smooth scroll.


See the Pen PoZLpbp by ihatetomatoes (@ihatetomatoes) on CodePen


This scripts working fine with normal projects but unfortunately, when i used it with vue JS the scrolling is not working like the above one. 

I don't know how to fix this problem as i'm a beginner


Can anyone please give me a solution

See the Pen poPzvrP by shahas-nizar (@shahas-nizar) on CodePen

Link to comment
Share on other sites

  • Shahas Nizar changed the title to Help with ScrollTrigger Smooth scroll + Vue JS (Gridsome)

Hi Shahas!


You need to adapt your Vue example to match the original one. It doesn't have the same the HTML structure so you need to fix that first. In your Vue demo, the #app element would be the #viewport element. And your setupLinks function is calling stuff that doesn't exists. You need to try to understand what that function does as it wasn't meant to be a copied and pasted like that.


  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...