Jump to content


Draggable - multiple layers

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've got a project where I've set up multiple circular dials, one within the other.  If you rotate one, it rotates the other at a different rate of speed.  One of the problems is that since they are divs that overlap, they are square and thus the inner dial will sometimes overlap the dial below it (since it's rotated at an angle, the corner of the square covers up much of the layers below it).


I would love to use the built-in click and touch handlers that Draggable has, is there a way to get all events of the Draggable object and determine the users' intent and instead of spinning the top-most layer it interacts with the correct layer below it?  I will try to create a CodePen example shortly.

Link to comment
Share on other sites

Have you tried setting a borderRadius on the dials so that the element shape conforms with your visuals better? Just an idea. Other than that, nothing easy comes to mind right now. 

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.