Carl

Read This First: How to Create a CodePen Demo

Recommended Posts

We're eager to get your questions answered, but in order to get you the fastest, most accurate response, it is very important that you provide code that we can test.

 

The cause of your problem may be related to CSS, HTML, or JavaScript (or a mixture of those). If you only provide a tiny code snippet (outside of its context), it's difficult to diagnose. And its just not practical to read large chunks of code in a forum post. We need code that we can dig into and play with...quickly.

 

We are big fans of CodePen.io which is an online HTML editor that allows you to create and share demos that our team can inspect, edit, and most often fix for you.

 

To create a demo that uses the latest version of TweenMax:

  1. Visit our Basic Starter Pen.
  2. Click the "Fork" button to create your own copy.
  3. Add the minimal amount of HTML, CSS and Javascript necessary to replicate your issue.
  4. Paste the URL of your pen (demo) into a new forum topic with a short description of the problem.
  5. Include OS, browser and device information where applicable. 

Watch How it is Done:

 

The Basic Starter pen loads the following core GSAP tools:

  • TweenMax
  • TweenLite
  • TweenMax
  • TimelineLite
  • TimelineMax
  • CSSPlugin
  • BezierPlugin
  • DirectionalRotationPlugin
  • AttrPlugin
  • RoundPropsPlugin
  • EasePack

For access to pens which use other tools (ThrowPropsPlugin, Draggable, SplitText) please visit our Support Starter Pens collection.

 

CodePen is completely free to use and you don't even have to sign up or log in. We do recommend creating a free account as it will allow you to save and organize your pens and much more.

 

Thanks for your cooperation. We look forward to helping you.

  • Like 10

Share this post


Link to post
Share on other sites

Hi Carl,

 

May we embed a CodePen pen into the forum body for easier access for everyone?

  • Like 1

Share this post


Link to post
Share on other sites

It's a nice idea but at the moment that functionality is not supported by our forums.

Share this post


Link to post
Share on other sites

Hi world :)

How can I embed stuff like SplitText and other bonus content? :)
I tried to upload them on my ftp and then link to codepen but it throws me

"Failed to load resource: net::ERR_INSECURE_RESPONSE"
Probably my ftp is just lame, anyway I would really appreciate some help.

Love your stuff btw ;)
 

Share this post


Link to post
Share on other sites

Hi patryksmakosz1,

 

Welcome to the GreenSock forums.

We would love to help, but I'm not sure where you are getting that error or what you are trying to do.

As a member you should have no problem using the bonus plugins that you download from this site.

 

It sounds like you may be loading some assets using http on an https page but I do not know.

 

Do you have a link we can look at?

Share this post


Link to post
Share on other sites

Thank you both for interest Carl and Diaco. I had not noticed your posts.

I wanted to play with multiple member plugins on codepen - Diaco solved that :)
Thanks again, now I can tween anywhere !
   

Share this post


Link to post
Share on other sites

Hi Friends,

 

I am new here and will learn more about greensock to use it in my web applications/websites.

 

Best,

BG

Share this post


Link to post
Share on other sites

I think if your greensock issues are really css, which i find often, you may want to try css tricks they have a forum...

Share this post


Link to post
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.