Jump to content
Search Community

Draggable – get position in external function

paul_ngc test
Moderator Tag

Go to solution Solved by GreenSock,

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

I'm using Draggable to give a few elements the option to be dragged around the viewport.

 

I have a function that I'm calling later on that needs the position (x,y) of these dragged items.

Is it possible to get the x and y values of those dragged elements? OffsetTop is not working due to the 3d translates.

Link to comment
Share on other sites

Have you tried getBoundingClientRect()? That's a method that's available on any DOM element (not related to Draggable).

 

See https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect

 

If you're looking for the actual x/y transform values, you can get those on the Draggable instance (it has "x" and "y" properties), or using element._gsTransform.x and element._gsTransform.y;

 

Does that answer your question?

Link to comment
Share on other sites

Thanks! The element._gsTransform.x works great. But I cannot seem to get it when working with a ThrowPropsPlugin tween. I want the coordinates when I send an Item to a different position. Animation is all good and smooth.

 

But I want to get all the coordinates during this tween. I only get 1 output at the end when I use the onUpdate function. I've added an Codepen that probably makes it more clear what I want to accomplish: 

See the Pen qqbvYp?editors=0010 by anon (@anon) on CodePen

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...