Jump to content
Search Community

MorphSVGPlugin problems

Wim Lammers 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 have become a GreenSock Club member (Shockingly Green) yesterday, and am now trying to use (and modify the MorphSVGPlugin). When I copied the files from CodePen onto my own laptop (and using Dreamweaver), I get a message that I am using a trial version of MorphSVGPlugin, only suitable for CodePen. I therefore downloaded the MorphSVGPlugin and modified the script to:

<script src="js/MorphSVGPlugin.js"></script>

Unfortunately, the morph (to the hippo etc) does not work. What am I doing wrong? In other words, how do I refer, in my own website, to a GreenSock plugin?

Thanks for any help!

Wim Lammers

See the Pen rOjeRq by GreenSock (@GreenSock) on CodePen

Link to comment
Share on other sites

Hi @Wim Lammers :)

 

Welcome to the forum and thanks for joining Club GreenSock.

 

Sorry to hear you are experiencing problems. Just so we don't overlook the obvious here. Is the plugin definitely in the js/ folder? Are you loading TweenMax too?

 

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.0.1/TweenMax.min.js"></script>

 

Can you upload your test animation to a page on your website? If that's not possible, a screenshot of your code would be helpful.

 

Happy tweening.

:)

 

  • Like 3
Link to comment
Share on other sites

20 hours ago, PointC said:

Hi @Wim Lammers :)

 

Welcome to the forum and thanks for joining Club GreenSock.

 

Sorry to hear you are experiencing problems. Just so we don't overlook the obvious here. Is the plugin definitely in the js/ folder? Are you loading TweenMax too?

 


<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.0.1/TweenMax.min.js"></script>

 

Can you upload your test animation to a page on your website? If that's not possible, a screenshot of your code would be helpful.

 

Happy tweening.

:)

 

 

Hi Craig,

 

Thanks for your reply! Much appreciated.

No, the 'obvious' is not a problem (I think!). The plugin is definitely located in the 'js' folder. I am also loading TweenMax.

I linked my morph attempt onto my website which you can find at: "BasicPhysiology.com" -> link: "GreenSock animation" located in the left column of the first (index) page.

Or you can find the code directly at:

http://basicphysiology.com/GreenSockAnimation/index.html

 

Looking forward to your comments!

Many thanks

Wim Lammers

 

 

 

Hi GreenSock.docx

Link to comment
Share on other sites

Thanks for the link. I see the problem. It looks like you grabbed the MorphSVG plugin from the npm folder. 

 

When you unzip your GreenSock download you'll see the src folder. In there you'd want to grab the MorphSVG plugin from the uncompressed or minified folder. I recommend the minified version. Once you make that change, you'll be all set.

 

Happy tweening.

:)

 

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