Jump to content
GreenSock

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

Uncaught TypeError: Cannot read property 'easeInOut' of undefined

Recommended Posts

Getting this error "Uncaught TypeError: Cannot read property 'easeInOut' of undefined"

I have added all the necessary scripts as follows:

 

script(src='/node_modules/gsap/src/minified/TweenMax.min.js')
script(src='/node_modules/gsap-drawsvg/drawsvgmin.js')
script(src='/node_modules/scrollmagic/scrollmagic/minified/ScrollMagic.min.js')
script(src='/node_modules/scrollmagic/scrollmagic/minified/plugins/animation.gsap.min.js')
script(src='/node_modules/scrollmagic/scrollmagic/minified/plugins/debug.addIndicators.min.js')

 

and Initialization as follows:
 

// Scroll Magic
// init controller
let controller = new ScrollMagic.Controller();

// build tween
TweenLite.set('.st0',{visibility: 'visible'});
let tween = TweenMax.from('.st0', 4, {drawSVG:0, ease:Power1.easeInOut});

// build scene
var scene = new ScrollMagic.Scene({
  triggerElement: '.test',
  duration: 96,
  triggerHook: 0.75,
  })
  .setTween(tween)
  .setPin('.test', {pushFollowers: false})
  .addIndicators() // add indicators (requires plugin)
  .addTo(controller);

Could someone help on this please? 
Any help appreciated !

 

Link to comment
Share on other sites

Welcome to the forums, @Pradeep KS

 

It's tough to troubleshoot by just looking at a few snippets of code, but I wonder if maybe you loaded your scripts AFTER your code? Just a guess. 

 

I'm also a bit confused about the way you're loading those scripts - I don't recognize that syntax. I'm used, to seeing <script> tags. If you're using a build system (looks like it since you've got node_modules), perhaps you need to import the proper classes? 

 

If you're still having trouble, please provide a reduced test case that reproduces the issue so we can take a peek. Also, please keep in mind that ScrollMagic is NOT a GreenSock product and we don't support it. 

  • Like 1
Link to comment
Share on other sites

Hey thanks for the replay.

 

I have sorted the above issue by reordering my scripts.


Im using pug, that's why the script tag looks like that.

I use ScrollMagic for scroll animation. If you dont support it what else can be used instead of it ?

 

Thanks 

Link to comment
Share on other sites

Glad you sorted out your issue. 

 

And I wasn't trying to discourage you from using ScrollMagic at all - I just wanted to be clear that it's not a GreenSock product so these forums may not always have answers for ScrollMagic-related questions, that's all. But I hear great things about ScrollMagic and plenty of people love using with GSAP. I don't have an alternate recommendation right now :)

 

Happy tweening!

  • Like 1
Link to comment
Share on other sites

Oh wow... That is great... 

 

Thank you so much for the support.

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