morphSVG not working outside of codepen

[sirhclluk]

So I just used your codepen to make sure I could get my own basic shapes to morph.

I works, but! 

I can't get this morph to work outside of codepen. I can only assume it's my js library links?

 

I have these 4 linked along with tweenmax & morphsvg linked from my desktop.

<script type="text/javascript" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/findShapeIndex.js"></script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>

<link rel="stylesheet" type="text/css" href="ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css">

 

 

Please help me morph!

 

Thanks

See the Pen QNEGvv by sirhclluk (@sirhclluk) on CodePen

[Jonathan]

Hello sirhclluk

 

That is because the GSAP MorphSVGPlugin is a Club GreenSock Plugin for members only with a Club GreenSock Membership (Shockingly Green or Business Green). The MorphSVGPlugin on codepen is only supposed to work on codepen for this very reason. So this way you can test and play with the MorphSVGPlugin for FREE.

 

More info found on the MorphSVGPlugin. Docs page:

 

http://greensock.com/docs/#/HTML5/GSAP/Plugins/MorphSVGPlugin/

 

The following is taken from that MorphSVGPlugin page:

• Get your hands on MorphSVGPlugin
  MorphSVGPlugin is a bonus plugin for all Club GreenSock members. It's our way of saying "Thank you" to those that are fueling innovation at GreenSock. To download DrawSVGPlugin, just log into your account dashboard and grab the latest version of GSAP.
• Try MorphSVGPlugin for free on Codepen!
• There's a special [fully-functional] version of DrawSVGPlugin that we link to in our demos in our MorphSVGPlugin Collection on CodePen, so feel free to fork any of them, add your own SVG graphics, and take MorphSVGPlugin for a spin. Codepen is a fantastic way to experiment. We highly recommend it. Note: the special version of the plugin will only work on the Codepen domain.
• To find out more about the many benefits of being a Club GreenSock member swing on by the club page and be sure to check out the other premium plugins.

I hope this helps!

[sirhclluk]

Hi Jonathan.

I do have business green.  

 

I have it working built in dreamweaver now. 

 

I was trying to use it with Tumult Hype, but I've killed a whole day with no luck.

If anyone is able to make it work within Tumult Hype please pass it on.

 

Thanks

[Carl]

Glad you got it working in Dreamweaver.

 

I have no experience with Tumult hype so I'm not sure how it handles svg. Are you adding your SVG inline so that the svg source is accessible in the page like

 

<svg height="100" width="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>

or is tumult using an img tag like

<img src="some.svg"/>

Also is the browser showing any errors?