payne199
-
Posts
21 -
Joined
-
Last visited
About payne199
payne199's Achievements
-
Rare
-
Rare
-
Rare
-
Rare
-
Recent Badges
6
Reputation
-
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.
-
Wow! I now get it. Thanks for taking the extra time with me. You guys (and GSAP) rock!!
-
Thanks for the info, guys. I have decided to run with a button to start things off and have updated the codepen to reflect that. On initial play, the sound is always delayed compared to the image coming on the screen. But after that first run, it will always run correctly, in sync. But of course, if I were to back-out of the page completely and go in again, the initial run will be out of sync. I looked for a similar problem in the forum but did not find one. Could you explain to me why this is occuring? The initial run has to be on the money.
