Jump to content

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

GSAP Integration to GRAV CMS

Recommended Posts

Can anybody show me a quick tutorial of how to integrate GSAP onto GRAV CMS? Aside from the declarations, I would really like to know how it should work. Since grav uses diff partials for each section while gsap treats it as one page am I right? Im relatively new to both GSAP and GRAV. If anyone could help me, it would really be great!

Link to post
Share on other sites

Hello Joshua and welcome to the greensock forum.


i don’t know GRAV CMS but is does look rather interesting so thanks for drawing attention to,it.

given that you are new to both then I would recommend checking out the GSAP documentation and learning centre as well as the grav documentation which seems to be very comprehensive.

as you say greensock treats a URL as a single page Whereas grav appears to let you Define css and js at a modular level.

the obvious issue is to keep your files and variables with unique names so that they don’t clash with each other as you can potentially have dozens of animations going on at the same time.


the greensock learning center has lots of videos and code pens that demonstrate the many plugins available and how to use them. I suggest that you start there and get back with a more specific gsap issue which the forum  will be pleased to help you with.


  • Like 1
Link to post
Share on other sites

Similarly to Richard I've never heard of Grav. But GSAP is just JavaScript so you include it like you could any other file in Grav. 


6 hours ago, Joshua6 said:

Since grav uses diff partials for each section while gsap treats it as one page am I right?

GSAP, like all JS, runs in the context of the whole page but that doesn't mean that if you include custom GSAP code in one partial that will necessarily affect other partials. It comes down to how your write your code, especially your selectors. If you write something like gsap.to('div', {}); then ya, it will probably affect elements outside of that partial. But if you scope the selector like gsap.to('.myPartial .someElem', {}); then it won't affect things outside of those selectors.


In abstract it's hard to give advice. If you have a specific question feel free to ask and we'll do our best to help out. As Richard said, the GreenSock documentation is pretty good. We highly recommend starting with the Getting Started article.


  • Like 1
Link to post
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.