jhtjards

Ok, so in my tests with the event callbacks that @tailbreezy suggested, overwriting can be false (and doesn't need to be auto) and the separation of the animations works well. The delayedCall however produces a js Error after a few seconds, even if you don't trigger the other animation at all: "Uncaught TypeError: s.call is not a function" https://codepen.io/jhtjards/pen/MWbEqoG I followed your advice however to encapsulate smileyface in a container element, i.e. <g class="smileyface-group"> Just to be sure: So one container per timeline (or even overlapping tween) is generally the cleaner way of having multiple animations on the same visual element? Also changed: I removed the delayedCall completely, I wasn't able to make it work and with the restart(true) I have my initial delay, which does the job too. https://codepen.io/jhtjards/pen/WNoZgZE

Nice! That did the trick! Very good to know, I'll try to avoid then in the future. Thank's a lot, also for risking your sanity. I sure must have lost parts of mine during the process to keep working on this. But it was definitely worth it!

You're right, I could settle with only the rotation for the effect, but I like it more with the additional axis' and also I'm trying to learn :) I did try overwrite: "auto", but there's still glitches in the movement. To illustrate this better I made my minimal demo slightly less minimal and added the speech bubbles I have in my actual project. Try moving your cursor in and out of these to produce the animation glitches. https://codepen.io/jhtjards/pen/BaQwxGd

Hi, i've started my first project with greensock a few weeks ago, had some problems along the way, solved them with the help of the detailed documentation and by quietly reading in the forums. Big kudos to the Dev Team for creating such a fun and high quality library and also to the awesome and super helpful community! But now I'm at a stage where I'm a bit stuck. I've created a little landing page with three smiley faces (svg) that pop out and in on mouseEnter / mouseLeave To draw attention to the little guys, I made an "idle"-timeline that makes them move randomly as if they were rummaging through some stuff in their caves. On mouseEnter they should stop rummaging and pop out ("tl"-timeline). It generally works, but there is one issue that I don't know how to get rid of: I had to place an overwrite: true into the animations, otherwise the timeline animations mix and produce all kinds of weird behaviour. But this removes all X and Y random motions i've declared and only leave the rotation being executed. Is there any other way of circumventing the animations mixing that keeps X and Y moving?