Trigger —

[mimeartist 26 Likes (Newbie)]

Hello,

 

I'm trying to make it so that when any item in a DIV is dragged, the whole parent DIV moves, but if just an item is clicked then it performs the click. I've made a codepen, but even the dragging is not working (it is in my real work)

 

The issue I have is that when the user clicks I want to get the attribute of the child item they've clicked on, even though I'm using trigger to make the parent draggable - I'm not sure why even the draggable isn't working in the codepen, other than perhaps my approach is all wrong... any ideas?

 

 

See the Pen abZExLM by mimeArtist (@mimeArtist) on CodePen

[mimeartist 26 Likes (Newbie)]

hmm... i think had the trigger the wrong way around? so have updated that, but how do i get the attriubutes of what I've clicked on?

[ZachSaucier 7,162 Likes (Superhero)]

Hey mimeartist. Normally you can just get the target by using this.target inside of Draggable's callbacks. But that gives you the Draggable target, not the element within the Draggable like what you're wanting. To get the element within the Draggable that was clicked on, you could either use .elementsFromPoint() with the pointerX and pointerY or add event listeners to the elements themselves (slightly better for performance). Demo of the latter:

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

Make sure to set allowEventDefault: true on the Draggable.

[mimeartist 26 Likes (Newbie)]

This is perfect, thank you Zach, i was trying to make sure this would work with ipad etc. and it seems to, that's why I was tying it in with draggable, so you could distinguish between dragging and clicking.