Jump to content


Draggable > addEventListener > callback > this

Go to solution Solved by OSUblake,

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



From inside the callback method of the addEventListener, is there a way to get a relative reference to the draggable instance?


In the codepen, to retrieve the instance inside the options callback, I use "this". Using "this" inside the addEventListener callback retrieves the target element (not sure why because the listener is attached to the draggable instance).


it would be preferable for me to use the addeventlistener way but in my situation I have many draggable instances and would like to access their properties and methods from inside the same callback. Let me know if that doesn't make sense.



See the Pen jbQGav by anon (@anon) on CodePen

Link to comment
Share on other sites

Hi jvkirkwo  :)


in this case " this " returns : event Target


pls try this :

var D = Draggable.create('.box');
D[0].addEventListener('press', function(){ console.log( Draggable.get(this) ) });
  • Like 1
Link to comment
Share on other sites

  • Solution

Is states in the docs that "this" refers to the target (element). Why can't you use the same onPress for multiple instances?  


Lot's of different ways to do this...

See the Pen bVQaow?editors=001 by osublake (@osublake) on CodePen

  • Like 3
Link to comment
Share on other sites

Ahhh I forgot about bind(). Thanks you guys. Both are great answers.

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.