Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Snape

Release Draggable div into another parent mess with animation

Recommended Posts

Hi,

 

I have options with gray border and selected with gray background: 

<div class="options">
 	<div class="item">Criancas</div>
 	<div class="item">Bebes</div>
 	<div class="item">Brinquedos</div>
</div>
<div class="selected">
</div>

 

On javascript part all of items are Draggable. And have the function onRelease that checks if the item "hit" the "selected" div.

 

All works fine, but the final animation. When I Drag the item is ok, but when i release it, the animation to go "back" to the x:0 and y:0 of the new parent starts from the another side of screen.

 

rv_animation.gif.bfc08854dde1db69c8f7f3f2eedd64d5.gif

 

When the item change parent they get new x and y and the release animation starts from that new coordinates.

 

How can i make the release animation starts from the actual coordinates relative to the new parent and avoid this bump?

 

Thks

 

 

Share this post


Link to post
Share on other sites

Hi @Snape,

 

Welcome to the forums.

 

It's pretty tough to troubleshoot with just a few pasted lines of code and a screengrab. Do you think you could put that into a demo for us? More info:

That'll give you the best chance of someone being able to help you. Thanks and happy tweening.

 

  • Like 1

Share this post


Link to post
Share on other sites

I created the pen:

 

See the Pen bJQNVr by rodrigosnape (@rodrigosnape) on CodePen

 

I tryed to insert the update(), but i guess i dont know where

 

Thanks

Share this post


Link to post
Share on other sites

It's probably easiest to just use getBoundingClientRect() to just figure out the change and adjust for it, like this: 

See the Pen Pgxqjy?editors=0010 by GreenSock (@GreenSock) on CodePen

 

Is that the result you wanted? 

  • Like 1

Share this post


Link to post
Share on other sites
3 minutes ago, GreenSock said:

It's probably easiest to just use getBoundingClientRect() to just figure out the change and adjust for it, like this: 

 

 

 

Is that the result you wanted? 

 

That is it!!! On the spot!

 

Thanks for your patience and your time!

 

 

  • Like 1

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.

×