
Etetherin
Members-
Posts
10 -
Joined
-
Last visited
Recent Profile Visitors
The recent visitors block is disabled and is not being shown to other users.
Etetherin's Achievements
0
Reputation
-
I know that this is beyond the scope of greensock now, I really appreciate the help. So you say add ALL the svgs into one <svg> </svg>? Do you mean literally all of them? I ask because what of the ones that are in different <section>?? <section> <svg></svg> <svg></svg> <svg></svg> <svg></svg> </section> This one makes sense i could turn it into this: <section> <svg> <style>(ALL OF THE STYLES FROM ALL OF THEM</style> <g></g> <g></g> <g></g> <g></g> </svg> </section> But the ones that are in other sections i have no idea how to do that. Also I am animating parts of the svgs and they stop showing at the clipping mask like you can see this in action here: http://aambrose.musites.org/interactive/test/ Which the top right with the clouds and land going by loop seamlessly. Could i still do that if they are all in the same <svg>???? Again thank you so much for all the help, perhaps some day I will be able to repay the favor by helping out here as well :). You did inspire me to buy the pro stuff.
-
Im not sure how to make a reduced case, or like im not sure what to take out really. I think the svg's need to be separate for my use case. I could be wrong but I am trying trying to Hide ones at certain times and at a later point there is going to be a completely different view. Thus I think that it needs to be a different svg's. All that being said i think this is the minified version of my project?
-
I am not actually, thats just a symptom of me not understanding how to use codepen with your plugins. here is a screenshot of my html scripts section: It auto completed the js/MorphSVGPlugin.min.js so i know its there.... but i am still getting this: I fixed this thank you. I followed those but to be fair i still get the error....
-
When I try to use MotioonSVGPlugin without importing it I get this: Invalid property morphSVG set to .OrbitIndicatorProgradePath001 Missing plugin? gsap.registerPlugin() I get this readout when trying to import MorphSVGPlugin: index.js:3 Uncaught ReferenceError: MorphSVGPlugin is not defined at index.js:3 Here is how I am trying to import it as per the plugins page: //Import plugisn from GreenSock gsap.registerPlugin(MotionPathPlugin); gsap.registerPlugin(MorphSVGPlugin); I am honestly really new to coding if it was not obvious. So the codepen may not show you what you need to know. So here is what I have in my actual code to grab it with: Draggable.create($prograde,{ lockAxis: true, //allows locking to an axis type:"x", //locks to the x axis bounds: document.querySelector(".control-prograde"), //makes it so it wont drag outside of the box. dragResistance: .5, onDragEnd: function() { gsap.to(this.target, 0.25, {x: 0, y: 0});// when user lets go it sends the icon back to its start position. gsap.to(".OrbitIndicatorDefault001", 1, {morphSVG: ".OrbitIndicatorProgradePath001"}); // gsap.to(".svg_rocket", {duration: 5, motionPath: ""}); //starts the animation when the user lets go. // $DefaultOrbit.classList.add('hidden'); // $DefaultExplain.classList.add("hidden"); // $ProgradeElipse.classList.remove("hidden"); // $ProgradeExplain.classList.remove("hidden"); }, onDrag: function(){ console.log($prograde.style.transform) ; } } ); Lastly I am not sure how to get the thing to run on the codepen, I am lost and trying to figure this all out. Thanks for the help!
-
Idk if this works like other forums, but I am still trying to fix this. Its for something that I have to do user testing on within the next 32 hours so if someone wants to help bail me out and help get it working its so much appreciated.
-
So does that mean its not necessarily something that I am doing wrong then?
-
This is my first post so if all these people who have viewed this are not helping me because of some thing I did wrong during posting please feel free to let me know.
-
I am trying to use MotionPath to animate along a path and it is getting the correct data for how it should move but is not actually on the path which is what i need. The code pen shows this issue. The ship "orbiting" should follow and be on the red path.