payne199
-
Posts
23 -
Joined
-
Last visited
About payne199
payne199's Achievements
-
Rare
-
Rare
-
Rare
-
Rare
-
Recent Badges
6
Reputation
-
Wow! Thank you for the education 🙂
-
I am displaying a simple timeline in which a question is presented, followed by the answer, followed by both the question and answer text disappearing. The idea is to loop through a series of questions and answers in this way. I am throwing the function an array of arrays and using a forEach loop to run through each individual array to make this happen. I see in the console that the loop is looping as desired, but only the final array is animating on the screen, rather than taking the time to run each array. What am I missing?
-
Sorry for such a basic question. But it is a real problem. I am a GreenSock member and trying to load SlowMo for the first time and it just won't go. I've written basic code and loaded the proper CDNs <style> .box{width: 100px; height: 100px; border: solid 1px black;}</style> <body> <div class="box"></div> <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/gsap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.7.1/EasePack.min.js"></script> <script src="EasePack.min.js"></script> <script> gsap.to('.box', 3,{x: 1000, ease: "slow(.1, .7"}); </script> </body> I've loaded the EasePack.min.js file into my project: By all appearances (to me) this should do it. The code runs but does not include the SlowMo. A simple task for many, but I've spent a lot of time spinning my wheels on this and getting nowhere. Would someone please direct me as to where I am going wrong?
-
NICE!! Smooth. (Thanks for the addition)
-
👍🏼
-
HI Zach. Yeah, your second Codepen nailed it! The code was much simpler than I thought in terms of the amount of lines used. But I'll be chewing on that one for a while to really grasp what is going on with it. Although I called them buttons, in reality they will be images. When an image is clicked, it will reveal text as it goes across the screen. The user is then being prompted to click the image again if they are wanting to be taken to that specific page/category. Thanks so much!
-
I have a set of 3 buttons. When a button is clicked, it moves, and then does a short animation. What I am trying to do is be sure the animations are in sync with one another if two or all three buttons had been pressed. This may not necessarily be a problem specific to gsap, but I am using the powerful platform and thought I would post to its forum. The Codepen should make my question clear. Thank you.
-
Wow! Sweet. charsClass study here I come.
-
Codepen entered. Thank you for the link.
-
I am putting together a simple (I thought) animation using SplitText. I am wanting a line of text to appear from left to right with a click of a button; and a line of text to disappear from left to right with a click of button. I got the appearing text to work, but I am having issues with the other. I can get the text to disappear as desired as desired, but it seems the only way I can get it to work is to have the text displaying on the screen, first. That is not what I want. I need the text to be invisible first, then appear from left to right after the button click. Here is my kinda-working code. Please see codepen. I have tried using css to set the opacity to zero and work from that, but I can’t get the text to appear at all from that angle. Could someone offer-up some insight?
-
That'll do it! Thanks OSUblake.
-
I have been working on a project that involves a timeline that simply goes from one scene to another (one function to another) using onComplete. In a couple scenes I am successfully using the DrawSVG and Text plugins. Recently I have gotten involved in MotionPath and have successfully put together a scene using it. However, when I include the MotionPath scene in my main project, those other scenes that involve DrawSVG and TextPlug do not render properly. I get the following errors Could anyone explain to me why these plugins suddenly appear to be missing when all I have done is add the MotionPath plugin? I am including the MotionPath plugin like so: And have been successfully using the TextPlugin: And DrawSVG, locally
-
Soooo cool!! Works great! Thank you
-
I have a GSAP folder that contains all the gsap plugins. When wanting to use the DrawSVGPlugin, I would simply bring that file from the plugin folder and place it in my project file, like so: I would then include the following code in my html: <script src='DrawSVGPlugin.js'></script> I was then off and running. I am now trying to include the new motionPathPlugin in my code but don’t understand how to get it there. I don’t have the file to pull from my plugin folder to include it in the way I have done with the DrawSVGPlugin. In an effort to get it to go, I have pulled the following plugin from the CDN src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.0.2/MotionPathPlugin.js"> and have included it in my html. I understand I need to register the plugin by including gsap.registerPlugin(MotionPathPlugin); in my code. I have tried including it in various places in my code with no luck. I don’t know how/where to put it. I understand this is not necessarily a GSAP issue, but understand I am 55 years old, not very computer literate, and simply discovered browser animation (GSAP) a couple years ago and have been having a lot of fun with it since. If someone would educate me on this issue to take advantage of this GSAP advancement, it would be greatly appreciated. Thank you.
