Jump to content
Search Community

Draggable area with draggable children issue

7linternational test
Moderator Tag

Go to solution Solved by GreenSock,

Recommended Posts

Hello, I was trying to have a background area being draggable (like a large canvas) and on top of it have draggable children. But when I drag the child the area gets dragged as well. Any ideas how to separate them? Should I check if the mouse is hovering over the child boundaries and disable the area drag or is there another way?

 

https://codesandbox.io/s/gsap-3-draggable-plugin-forked-pwibg0?file=/src/Area.js:702-953

Link to comment
Share on other sites

  • Solution

I don't have time to look at your demo right now, but when you click on an element's children, that's automatically interpreted by the browser as clicking on that element. So you shouldn't apply your Draggable to the parent - you should instead create an element that's just the background, sitting behind the other clickable elements. You could actually apply the Draggable to the parent but use the separate background element as the "trigger" for the Draggable - that's probably the best approach. Does that help? 

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...