Jump to content
Search Community

Animation not being Fired with BarbaJS

rootx86 test
Moderator Tag

Recommended Posts

I am using BarbaJS for creating my Portfolio by using a <ul> for creating a Page-Transition. I have set up GSAP Animations and Many More such as AutotypeJS but they aren't getting fired neither are the CSS is getting applied after the Page transition is done. Once I refresh the page, The Animations gets fired.

What could be the possible reason?

 

 

 

        gsap.from('.btn-blue', {
            opacity: 0,
            duration: 0.5,
            delay: 21,
            y: 50
        });

        gsap.from('.anim1', {
            opacity: 0,
            y: -100,
            duration: 0.5,
            stagger: 0.5
        })

 

Link to comment
Share on other sites

Hey @rootx86

 

This is probably not related to GSAP at all, but more to the way barba.js handles things.

The thing with transiton-libraries, such as barba.js is, that on transition they remove the old contents and add in the new contents.

 

If your GSAP animations refer to any of the contents that have been removed, they will stay connected to those contents after the transition.

For solving that, so you will need to put those animations you are creating inside a function and call that function after the new contents on your page have been loaded by barba ( best inside one of the hooks provided by barba ).

 

Hope this helps.

Cheers,

Paul

 

  • Like 1
Link to comment
Share on other sites

Hey rootx86. It's impossible for us to tell what's going on given the information that you've provided. It's almost guaranteed to be an issue with your setup, not anything with GSAP. Unfortunately we don't have the capacity to debug every Barba project that uses GSAP. If you have a question specific to GSAP please ask and we'll do our best to help!

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...