Adam959

Thanks for the help Zach, the call function is definitely more suitable. There is still an issue, which is that the .call() function is sometimes being called twice during the reverse timeline. This results in the SVG note returning to its original position, but having moved the element twice - it places the note above the letter base, rather than below. You can replicate this issue using your example. I've been looking at this for several hours now but I cannot figure out what is happening. The click function is definitely only being called once so it really seems to be that either the timeline or call function is being called twice. Any ideas? Cheers

I am trying to move an SVG element into the foreground/ background during play and reverse. I can get the element to move to the foreground at the start of the animation within the timeline, but I cannot get it to revert this change. I have tried using onReverseComplete on VSCode which works to an extent (some strange behaviour where it works randomly, but then will not work seemingly randomly), but on codepen onReverseComplete doesn't seem to work at all, despite using the same versions of GSAP. Any clues or suggestions would be greatly appreciated. function openCloseContactInfo() { var contactAnimTlm = new TimelineMax({ paused: true, reversed: true }); contactAnimTlm.to(Note, { y: -100, onComplete: bringForward }) .to(CONTACTletters, { opacity: 0 }, 0) .to(ContactInfo, { opacity: 1, onReverseComplete: bringBackward }, 0.5) .to(Note, { scale: 3, transformOrigin: "50% 50%", y: 0 }, 0.5); $(MailBody).click(function () { contactAnimTlm.reversed() ? contactAnimTlm.play() : contactAnimTlm.reverse(); }); } Thanks, Adam