Jump to content


  • Posts

  • Joined

  • Last visited

Everything posted by menschies

  1. ?‍♂️ <-- me after seeing this... and now my back needs ice. You the man!
  2. Easier said than done--ha. Working on it. (more coffee please...) Cool example. Especially like the graphical points to see the translation in action.
  3. Howdy, Jack (@GreenSock)! Yikes, I made a blunder thinking there was a function, 'waveSVG', that took a path and made it wavy given a few variables -- solidified a "D'oh!" status for the week. I updated the codepen with the creature and its tail. The goal: with tail origin anchored to the body, have a sinusoidal motion move the tail through its end. I could begin with straight or slightly curved path. I was hoping to find examples I could learn from. After some review, one approach could be: get the points of the path in an array calculate a new position for each point using math functions for sine/cosine move each point in a loop using TweenMax.to elastic ease Something like that? Is there an easier approach? Looking for pointers. Also, if this is not the right place to request this kind of help, then StackExchange? Appreciate your feedback.
  4. Hey all! It's been awhile. I have a couple of paths in an SVG I need to animate using a sinusoidal-like path with a fixed starting point and a variable end point. Imagine a tail flapping about in a strong wind. If you can point me in the right direction, I am struggling to figure this out. Thanks! https://codepen.io/macarius/pen/oPwyyq
  5. Thank you @Dipscom and @Jonathan for your guidance. I attempted to use a path defined in the Ollie SVG to animate the position of the rocket and orient it along its trajectory. I wasn't sure how else to achieve this. I noticed the {x,y} coordinates you chose, @Dipscom. How did you derive these, and how can I generate these? Also, the coordinates don't scale with window zoom. Can you apply a factor to these, or is there a better method? Are there any major issues or drawbacks if I use an SVG as a background image in a <div> vs. nesting the SVG within the <div> as an <img>? Thanks for your time and expedient responses!
  6. Greetings! My first post so forgive any noobishness... I started my journey with GSAP a week ago, and I'm enjoying the heck out of it. I promise not to abuse the power I'm given. *fingers crossed I'd like to create a scene where a rocket launches from the moon. I created 2 SVGs: moon and space cadet Ollie. I've scoured the forums and read about containing all "images" into a single SVG, but for me it's easier to edit and manage the vector images in separate files -- for now. Can someone please recommend an approach (cross-browser compatible, including mobile) to position the rocket on the moon? Must I use a single SVG? Thank you! (Also, anyone want to help us make our nonprofit landing page?)