Slider within a slider using draggable.js

[Sheraz]

Is there a way that I have a draggable object inside another draggable object. I am developing a mobile app and want to have a slider within a slider. 

[Rodrigo]

Hi and welcome to the GreenSock forums.

 

Sure, since Draggable has an onPress event that's basically reports mousedown/finger-touch you can stop the event from bubbling up from the child element. Like this:

Draggable.create("#child",
  {
    type:"x,y",
    bounds:"#parent",
    edgeResistance:.8,
    onPress:function(e)
    {
      e.stopPropagation();
    }
  });

Draggable.create("#parent",
  {
    type:"x,y"
  });

You can see it working here:

 

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

 

Here's the link to see it better in touch devices:

 

http://cdpn.io/aczDt

 

Rodrigo.