Jump to content
Search Community

FARIOA

Members
  • Posts

    7
  • Joined

  • Last visited

FARIOA's Achievements

  1. ? @GreenSock You are the best. Thank you for all of your help!
  2. Yep! That's a really interesting concept, and VERY useful now that I know how to pull it off. However, I now have a new issue due to making that change. I have two additional buttons, one that doubles the speed of the timeline, and one that instantly finishes the timeline. (I didn't include these buttons in the earlier codepen because it was minimal). I fixed the one that doubles the speed by doubling the globalTimeline timescale, but I can't figure out how to fix the instant finish button. I added it to the codepen so you can see how it worked previously. ^^ Possible solution: Using a global variable as a helper, setting the tween to that helper so that I can call seek on the tween. Is there any other solution? Once again, thank you for all of your help. I will edit this is if I figure out a fix before someone gets to it. https://codepen.io/gstops/pen/bGLmpGX
  3. Hi @GreenSock, my apologies for not making a codepen originally. I just wanted to know if there was a specific method or something similar that would do what my code did. Regarding the duration recalculation, I was playing around with stuff to see if gsap would recalculate when the tween repeated. Obviously, I know now that it doesn't. After doing a whole lot of research into keyframes and tweening the playheads of timelines, I ended up figuring it out from a very old forum post titled, "The ease can work on timeline whole animation?" . I attached the working codepen at the bottom of this reply to clear up everything. Thanks a bunch for offering me those solutions, the last one certainly did the trick. Sidenote: Can you explain why I need the "time: pointerTimeline.duration()," when I tween the timeline? https://codepen.io/gstops/pen/bGLmpGX
  4. I was trying to change how long a tween runs for in a timeline in between the repeats of itself. I couldn't figure out how to, and ended up just breaking it up into separate tweens. Is there a way that I am missing? pointerTimeline.to(".pointer", { //Bounces back and forth duration: time/ (2 * pointerTimeline.repeat()), rotation: "-=" + pointerMaxDegree, ease: "linear", yoyo: true, repeat: 3, }); ^ Me playing around with the repeat This is what I ended up doing. pointerTimeline.to(".pointer", { duration: time/ (6), rotation: "-=" + 170, ease: "linear", }); pointerTimeline.to(".pointer", { duration: time/ (5), rotation: "+=" + 170, ease: "linear", }); pointerTimeline.to(".pointer", { duration: time/ (4), rotation: "-=" + 170, ease: "linear", }); pointerTimeline.to(".pointer", { duration: time/ (3), rotation: "+=" + 170, ease: "linear", });
  5. @PointC Yep. That would be EXACTLY what I'm looking for. You're a lifesaver, and also quite possibly a mind reader. (No clue how you understood what I meant and found the method I needed). I know who to ask if I have more questions... Thank you so much for your help!
  6. Thank you @PointC! My mind totally missed relative values. That would certainly do the trick. However, I realized that I missed something small in my codepen. In my actual project, I put a ,0 after the "to" method to set it to the first spot in the timeline. I don't want to run the animation repeatedly in the timeline, instead, I want to have the object save the rotation amount so that it starts from there each time I click spin. I coded it as such because in my actual project, I use a random value for the amount of rotation that takes a couple of variables, so the spin amount changes each time. How would I go about this? Let me know if you need more information about it, or if you would like me to create another codepen for it.
  7. Hi, I am relatively new to greensock, but I am trying to have the block maintain it's rotation and movement in between calls of spin instead of having the block reset every time. How would I go about this? I thought the to method moves from the object's current location? Thanks in advance.
×
×
  • Create New...