Dragging when a div in front...

[mimeartist]

I've got a draggable background, but it needs to have an transparent layer of small dots (which I'm using a transparent .png for) over the front that don't move... I know this isn't strictly a gsap issue... but is there a way to drag a div that is below a div you don't want to move?

[Jonathan]

Hello mimeartist,

 

If I understand you correctly.. you want to make it so an element doesn't  accept any events? ..

 

You could do this with just CSS using pointer-events:

#element {
      pointer-events:none; // disable mouse events on element
}

pointer-events:none will stop the element from receiving any mouse events. Which in turn allows you to click through the element, and click the element below it.

 

pointer-events: https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events

 

Let us know if this doesn't answer your question?

[GreenSock]

Yep, I'd guess jonathan's suggestion is right-on, and if for some reason you don't want to follow that advice, you could try defining the dots as the "trigger" on the Draggable. 

Draggable.create("#background", {trigger:"#dots"});

[Jonathan]

Nice Jack... I forgot about the trigger parameter

[Rodrigo]

Here's a little sample of Draggable's trigger made some time ago:

 

See the Pen IiHgq by rhernando (@rhernando) on CodePen.

[jamiejefferson]

pointer-events is awesome, but don't forget that IE doesn't apply it

 

http://caniuse.com/pointer-events

[Jonathan]

Yes awesome Jamie, but from that link it looks like IE11 supports it.. but your link got me thinking of the versions of IE that don't support it..  very long list

 

Try this JS pointer-events kludge for CSS pointer-events support in IE10 and below:

 

See the Pen BriCb by jonathan (@jonathan) on CodePen.

 

Let me know if your able to still click through the red moving bar in IE10 and below when the checkbox is checked.

 

Thanks

[mimeartist]

Wow... thanks for these... will give it a whirl and let you know how I get on. I'll need to have it working on lower versions of IE so probably will have to try the trigger route.

[tarwin]

Is there a way to pass an element to "trigger" that is not a child? Is there a reason that it is children only?

[Carl]

The trigger is not restricted to being a child. 

Please see this fork of a very nice man's pen:

 

http://codepen.io/anon/pen/vBcFq