janpaepke / ScrollMagic

The javascript library for magical scroll interactions.
http://ScrollMagic.io
Other
14.9k stars 2.17k forks source link

GET 404 - on my scripts #327

Closed destradafilm closed 9 years ago

destradafilm commented 9 years ago

Hi, I am new to ScrollMagic. I was having no problems with Simple Pinning, but I want to add a Tween to my Div and I'm getting an error with my js scripts loading.

I believe I have them in the proper order.

This is the order I load the scripts: scripts

!!!!!! THE ERROR I'M GETTTING: !!!!!!!!!! "animation.gsap.min.js" is 404 AND it says setTween is not a function!

HOW I CALL THE TWEEN FUNCTION: set tween function

My CONSOLE: console_error

ANY SUGGESTIONS?

MUCH APPRECIATED...THANKS

johnfmorton commented 9 years ago

I think you're probably having a path issue with your GSAP script.

Try using their CDN instead. That might make both issues go away.

<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.16.1/TweenMax.min.js"></script> Once you've got your animation library loaded successfully, the setTween function should work as expected.

UPDATE: I think I misread your issue... ignore this specific code, but I still think you're probably having a path issue with the animation.gsap.min.js file. Your HTML isn't finding it. Can you confirm it's in your directory where your HTML says it is?

UPDATE #2: It looks like the CDN also has the plugins. Try this URL instead of getting your plugin from a local path: http://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.5/plugins/animation.gsap.min.js

You can see all the CDN hosted files here.

destradafilm commented 9 years ago

Thank you so much for your suggestions. I really appreciate your help.

Well, oddly enough my path is correct for the animation.gsap.min.js . I double checked it and moved it to another file and renamed it...still kept breaking. I'm wondering if I need to consider Require.js or another AMD API?

Either way, I changed it to their CDN and it fixed the 404

But, I still get some errors:

-Cannot read 'Scene' of undefined and -scene1.setTween is not a function

screen shot 2015-05-28 at 3 31 10 pm

johnfmorton commented 9 years ago

I don't think you need another library like Require.js.

I was responding via my phone previous. Now I'm looking at your code more closely. I think you may need two separate scenes for what you're trying to accomplish. The first scene to do the pinning and a 2nd scene to control the tween. Can you try making them separate scenes (added to the same controller) and see if that changes anything?

destradafilm commented 9 years ago

I tried that out, and it doesn't seem to work either. CODE: screen shot 2015-05-28 at 9 52 48 pm

ERROR: screen shot 2015-05-28 at 9 53 06 pm

SAMPLE CODE FROM SCROLL MAGIC: I got the sample code from the Examples of Simple Animation with GSAP here: http://scrollmagic.io/examples/basic/simple_tweening.html

screen shot 2015-05-28 at 9 57 39 pm

johnfmorton commented 9 years ago

I think I spotted the problem. Try loading the plugin after you load the main class for ScrollMagic. Does that change things?

destradafilm commented 9 years ago

Awesome, thanks johnfmorton!

That did get rid of my script problems! thanks!