Shaman

@ZachSaucier You are the Master! Thank you so much. Have a great day.

Hi again, It's done with a minimal bug : https://codepen.io/Shaman1975/pen/PobaZXx Sometimes the pictures jump back to the initial position instead of tweening and I don't find out why... I used your method @ZachSaucier and I'm happy with it if it wasn't for the bug. Any idea? Thank you so much for your time and effort @mikel but in your version something isn't working right. If you quickly hover over Oscar, he will not go back to his initial position but that's what I need. Whatever the user does and for how long, after a short time the image should move back to it's initial position. Kind regards, C.

Thank you @ZachSaucier & @mikel, I tweeked your idea a bit and for the "x"-animation, i'm quite happy. Also I tried to fix the: Hope that's ok now? But "y" is a not ok yet: Actually, I think I need another formula for the "y"... (Similar to "x"). Another thing I would like to achieve: How would I reverse the animation after each move? https://codepen.io/Shaman1975/pen/mdOLXbv Thank you again for your time and your help.

Hi Mikel, Try this : <text class="touch" x="20" y="75">from TOP</text> <text class="touch" x="20" y="75">from RIGHT</text> <text class="touch" x="20" y="75">from BOTTOM</text> <text class="touch" x="20" y="75">from LEFT</text> https://codepen.io/Shaman1975/pen/oNYdMjv

Hi again Zach, I forked the pen and got this far but I think I still don't get it ? EDIT: Actually my question is now how to use the result to move the image in the same direction? Could you please have a look (again)? https://codepen.io/Shaman1975/pen/OJbvYPJ Thank you

OMG Zach, I don't understand what you are saying. I'm really sorry. So I try in my words: Getting X & Y from draggable to each image - ok Not sure if I understand how to test this. -> Maybe I really could use your help here Animate the item in the opposite direction (In proportion to the distance) - somewhat ok but I think I can do it

Hi Zach. Thank you for looking into this matter and your time. My end goal is that the images should move away from the draggable and come back after a short time. That's already working but only in one direction... So if I push them from the right they should move a bit to left and come back and vice versa. And that for every direction.

Hi, In the following Codepen I try to 'push' the image elements into the direction the mouse (draggable can) came from. Actually I was wondering if there is a method to use the directions result from 'getDirection' ('right', 'up', etc. ) to use in my demo. Else it would take 8 "IF's" to determine the direction the image should move to. Is that right? E.G.: animation.to(shaker, { x: "+=50", duration: 0.4 }); would need to pass 8 tests to tell the animation where to move? I'm not sure if this is well explained. English's not my mother langage, sorry. Kind regards, C.

You are absolutely right This drove me nuts during days because I always tested on THAT screen... and on mobile. Thank you all for your time, have a nice day, Claude

Ok, was testing this a little further. If I put that monitor to primary screen it works. As soon as it isn't the primary screen anymore, this happens. Any thoughts?

OMG!!! You will never believe but I've almost tears in my eyes! My Setup: 3 screens (2x27'' @1920x1080 1x40''@3840x2160) On 1 of the 27'''s this happens!! All the other screens/browsers work! Could confirm this on any screen? I'm going nuts. I can't even believe this myself. Even if I only take a tab and move it between the screens, it only works on the other 2. Is there any logical reason to this? I'm not halucinating

Hi, After struggling for so long, I found out that my problem wasn't due to my fault: No matter what I try in Chrome, the mouse cursor won't change to 'grabbing' while dragging an object. Exaclty like in this codepen: https://codepen.io/GreenSock/pen/zDwEk Runs flawlessly in FF. Is there anything I miss? Is this known or can it be confirmed by someone please? Maybe there is already a solution to this? Thank you, C.

You are right, removed that one too. It's a browser problem btw. It works nicely in Firefox but only there.

Actually the cursor changes on the svg! If you put your mouse below the can, where the water will be, you'll see it Can we somehow separate both (the can and the svg) and attach the svg animation to the can on grab?