Acccent

If you're having trouble, have a look at
See the Pen EKYWja by Acccent (@Acccent) on CodePen
, but I'd suggest trying to figure it out on your own first

Okay I fixed it! I just had to move tl.seek() in Diaco's pen before the TweenLite that updates the panel's position:
See the Pen WQZYaQ by Accent (@Accent) on CodePen
 
Now it all works, although to be honest I still think it's a tad complicated, but it'll do!

Alright I think I understand why it behaved the way it did. My cycling timeline was something like:
fadecycle .staggerTo([$a, $b, $c], 2.1, { opacity: 0 }, 10) .staggerTo([$b, $c, $a], 3, { opacity: 1 }, 10, 0.6);  
And I assumed the order in which I passed the elements would make it understand how I wanted it to behave, that is:
 
t 00.0 ..... $a fade out
t 00.6 ..... $b fade in
t 10.0 ..... $b fade out
t 10.6 ..... $c fade in
t 20.0 ..... $c fade out
t 20.6 ..... $a fade in
 
But apparently the order isn't recognised well? and the timeline ended up looking more like
 
t 00.0 ..... $a fade out
t 00.6 ..... $a fade in
t 10.0 ..... $c fade out
t 10.6 ..... $b fade in
etc
 
I fixed it by simply writing a more explicit timeline. I tried to use staggerFromTo + SlowMo easing, but couldn't get to a transition that was quite perfectly like the one I'd tuned (which I had spent time on to make look just right). There's as many lines as the equivalent thing in Velocity.js now oh well At least it works. And the cycle feature mentioned in your link, Diaco, looks very promising, so I'll have a look at that tomorrow.
 
Thanks!