Jump to content

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

gsap.to autoAlpha

Go to solution Solved by akapowl,

Recommended Posts

I'm trying to reverse an animation when scroling back up using autoAlpha, but i get this error in the console


Invalid property autoAlpha set to 1 Missing plugin? gsap.registerPlugin()
Invalid property y set to 0 Missing plugin? gsap.registerPlugin()
i set an if else function when scrolling direction is equal to 0 on the autoAlpha property,
function initNavigation(){

    const mainNavLinks = gsap.utils.toArray('.main-nav a');
    const mainNavLinksRev = gsap.utils.toArray('.main-nav a').reverse();

    mainNavLinks.forEach(link => {
        link.addEventListener('mouseleave', e => {

            // add class

        link.ontransitionend = function() {
            //remove class

    function navAnimation(direction){
        const scrollingDown = direction === 1;
        const links = scrollingDown ? mainNavLinks : mainNavLinksRev;
        return gsap.to(links, {
            duration: 0.3, 
            stagger: 0.05, 
            autoAlpha: () => scrollingDown ? 0 : 1, 
            y: () => scrollingDown ? 20 : 0,
            ease: 'power4.out'


Link to comment
Share on other sites

Maybe you could put that into a demo for us?


  • Like 3
Link to comment
Share on other sites

  • Solution


23 minutes ago, faridguzman91 said:

scroll down the back up, the animation from the nav bar links wont play in reverse,


Looks like you just forgot the brackets to make it functional


const mainNavLinksReversed = gsap.utils.toArray('.main-nav a').reverse;


const mainNavLinksReversed = gsap.utils.toArray('.main-nav a').reverse();


See the Pen d7f78af163334f2a70415535738e0354 by akapowl (@akapowl) on CodePen


  • Like 3
  • Thanks 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.