Jump to content
Search Community

Initial SetUp, Someone be my Hero

chargar test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi,

I'm having some trouble sourcing the 2D animations.  I've downloaded the zip, src'ed it in my project and even used the cdn but i cant get the animations to work outside of codepen.  I'm basically trying to get this 
to work.  My questions are:  1) Do i need some sort of key to make animations run on a server or something like heroku?  If so, where do I access that key?  2) Does the CDN link all of the extra fun plugins?  3) Are there any other languages I need to source in order for greensock to work?  I'm using basic html5, css and jquery.  4)Is there an example that walks me through linking files if the cdn doesn't provide your entire lib?(so far it seems like every tutorial skips a step or two)?  Right now the current error I'm getting is that 'slider.slider' is not a function....  5) final question.  Why are you linking/sourcing files outside the <head> tag and what order to they need to be in?  Thank you so much for your help.  This stuff is so cool and super easy to navigate, the hardest part is just getting it set up.  

 

I've attached my html page, I'm not used to src files right above </body>.

index.html

See the Pen ModJKx by CharGar (@CharGar) on CodePen

Link to comment
Share on other sites

HI @chargar :)

 

Looks like you're missing a couple files that the CodePen is using:  (jQuery UI and touch punch). Please add these scripts to your project:

<script src= "https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src= "https://cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>

 

Regarding the Club plugins - there is no CDN link so you will have to host those on your own. Just download them from your GreenSock account and put them into a folder for your local project.

 

That should get you up and running.

 

Happy tweening.

:)

  • Like 4
Link to comment
Share on other sites

PointC!  Thanks for your help, that got the animation working locally but I've tried to download the files and im not sure that im doing it right.  I just click the plugin that i want and click download and source them from there right?  I'm now getting this error thrown at me.  

Screen Shot 2017-07-18 at 2.43.34 PM.png

Link to comment
Share on other sites

You're a Shockingly Green Club member so you should be able to click on your profile and there should be a zip download in your dashboard with all the bonus plugins. It should be something like:

GSAP with Shockingly Green bonus (1.20.2) 

 

Click that and unzip it to your local development folder and you should be good to go. You can use the CDN links for TweenMax and non-club plugins, but all those bonus plugins will have to be hosted with your project files.

 

Happy tweening.

:)

  • Like 5
Link to comment
Share on other sites

PointC, you are the man.  Thank you so much for your help with this.  The GreenSock product is epic, but the community and how willing people are to engage with and teach newcomers... thats what will keep me renewing my membership.  It simply can't be beat.  Thank you.

 

 

Charlie Garnaas

  • Like 4
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...