Jump to content

Search In
  • More options...
Find results that contain...
Find results in...


  • Content Count

  • Joined

  • Last visited

Community Reputation

0 Newbie

About Wrapped

  • Rank
  1. Thanks for the reply, I've decided to simplify the solution somewhat to make life easier but I'm still having issues with window resize events. Is there some documentation that I may have missed relating to the values returned by MotionPathPlugin.getRelativePosition and how to have these values recalculated on window resize? I read somewhere that this isn't a feature by default due to the CPU overheads this would incur by having a constant listener for window resizes; however, is there some method I can use in order to make this responsive? Many thanks.
  2. Hi everyone, first time poster here so please go easy on me. I've been attempting to create a timeline for a project whereby an element will shrink in size, move to another element on the page and grow again tied to the page scroll event. Eventually it will need to move to a series of points on a page and follow the same series of animations for each point. For this, I have attempted to utilise ScrollTrigger and MotionPathPlugin in order to handle the scroll events and element positions, the attached codepen URL shows the basis of the code that I am using for this purpose so far. I have had success in creating a timeline that does what I had envisioned between two elements so far; however, am having issues relating to window resize events. Based on another post I read on the forum (don't have a link to it unfortunately), I attempted to kill the timeline and restart it passing the current progress in order to update the MotionPath values, but this doesn't seem to work. Is anyone able to provide some insight as to why this is and perhaps point me in the right direction for solving this issue. Additionally, am I even going down the right path in order to achieve the result I desire? I predict I will run into issues when animating to a series of elements using the method I am so far. I thought about mapping a series of coordinates on the page based on the target elements and animating along that mapped path somehow. Many thanks in advance. *edit - updated pen to most recent code*