lennco

Hi @RichardC Is it just the ease for stopping the sub you're after? // this ease just creates a forward<->back-motion var stopEase = 'M0,0 C0.124,0 0.394,0.151 0.484,0.162 0.656,0.182 0.838,0 1,0'; function _Stop(speed) { TweenLite.to(div, 0.2, { ease: CustomEase.create("custom", stopEase), x: '-=' + 300*speed }); } _Stop(0.5);

Hi @vicmortelmans I put together an example on how to combine some simultaneous tweens, hopefully matching (...) the scenario described in your post.

Hi @Johny13 Are you sure the element you're targeting is actually scrollable? You can get the current scroll position of an element like this: var body = document.querySelector('body'); console.log(body.scrollTop); I tried adding a div parent with 'overflow:scroll' and set it as the scroll container in the tween, and it worked just fine as far as I could tell. Edit: In Codepen it's the parent element of the body that gets the scrollbars.

You're very welcome

I'm sure it can be done alot better, but just added a function for clicking the circle to make it jump back to its original position. Click it again to animate it.

Hi swaranan Something like this?

Hi chapolote Adding to Sahil's answer... You can use the onComplete event to trigger a new timeline and use that as a "repeat" where you initialize it with new values.

Hi Guido After some initial testing I can conclude that there's a problem with the bounds. When it jumps, it does so to either 360 or 0. If you keep holding the mouse button down, and drag the mouse pointer once cw or ccw arround the center, it starts moving again. The behaviour is the same as if you keep pulling the mouse arround the center (and then back again) after the knob has hit max- or min bounds. Edit: Scratch that. The rotation value is increased or decreased by 360 if using bounds or not. It was just a symptom. I have no idea what's going on, but maybe someone will find the observation useful

Diaco beat me to it Anyways, here's what I came up with: Edit: movement triggers when hovering. Edit2: Made the flow feel more natural. Added a slight rotation to see it from the side. If you want to see it from the top, just remove the rotation from the stage class.

Hi Tasty, If you remove the ease on the stagger, you can clearly see why it's delayed: Using the 'visibility' property: Low duration stagger:

Hi Noturnoo, What about moving the picture to a fixed layer, and then scaling it?

More detailed explenations as to why are always appreciated, so thank you! And it all makes perfect sense after reading your post.

Ah OK, thanks.

Hi Jonathan, I only tried clicking the button like a normal person, so maybe that's why you can't replicate the problem? In either case, your solution works very well. Best of all: it doesn't require a "hack". So I think that's the one I'll go with. Where did you find the information on GSAP setting the display property at the end of the animation when using autoAlpha? The documentation only mention that it sets the visibility property. The few times I've tried using the display property in timed tweens, I never ended up with the desired result...

Thank you for the very thorough explenation and clear examples, Carl. Much appreciated. Your sugested solution also works well.