Jump to content


Draggable.create, onClick not working when disable()

Moderator Tag

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





Is it possible to keep the OnClick event on the Draggable to be triggered including when the disable() method has been called on the Draggable element? From the Draggable documentation, the method disable() should disable the Dragging, not the whole element and its events. But it does.


Using a JQuery.click on the element doesn't seem to be an option, as the click event is triggered during drag and drop, and using the mouse pointer location does fix the click on drag issue, but then the whole prevent bubble event gets messed up, and when there is a button inside the element. You can see it here.


The only feasible way would be to make the OnClick event from Draggable work always, inclusive when disable() has been called. Is it possible to do so without having to change the Draggable.js library? 


See the Pen oGWEjq by rkkoszewski (@rkkoszewski) on CodePen


See the Pen VMbXmZ by rkkoszewski (@rkkoszewski) on CodePen

Link to comment
Share on other sites

Hm, I'm having a hard time wrapping my head around exactly what you're after. When you disable() a Draggable instance, it should completely disable it (not just dragging). Therefore, it's expected behavior that its onClick wouldn't fire (that'd be weird if a disabled object kept firing off events and stuff). 


Maybe it'd help if you showed in one of your codepens a challenge that you want to achieve. For example, maybe you want to click on the draggable element and make it turn something else red but only when it's clicked and not dragged? Sorry if I'm missing something obvious here. I read your post about 4 times and looked at the codepens and from what I can tell Draggable is working exactly as expected. 


If your goal is to keep the Draggable element from being dragged in some cases (without disabling it), maybe set its dragResistance to 1? Or do some fancy logic in an onDrag? 

  • Like 2
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.