Draggable - Weird interaction with mousedown

[Frank Mawn]

Hi everyone,

 

I've been playing around with Draggable and noticed a strange behavior. 

The mousedown event works fine if I add the eventListener to a draggable element using the lockAxis setting, but the default "x,y" won't trigger it.

Am I missing something?

I've put a link to a codepen which illustrate the issue. The green box will trigger the mousedown (right-click) and the red one is not.

See the Pen Jrqvrb by FrankMawn (@FrankMawn) on CodePen

[PointC]

Hi @Frank Mawn

 

Welcome to the forum.

 

Your pen seems to work correctly in Chrome and FF for me, but not in Edge. You might want to try this:

 

Draggable.create(".box:not(.lockaxis)", { type:"x,y", allowEventDefault: true });

 

I'm not entirely sure why the lock axis version is working correctly without that allowPreventDefault in there. Here's a similar question that may be helpful.

 

 

Others may jump in with additional details or thoughts. Happy tweening.

 

[Frank Mawn]

Wow, thanks @PointC ! Worked like a charm  

I couldn't find this option anywhere in the Draggable doc, maybe an oversight?

 

Sorry for the double post. 

[PointC]

I'm not certain why that isn't documented. I'll leave that to @GreenSock or @Carl to answer.

 

I almost always use the built in handlers: onPress, onClick and onRelease, but I can see certain situations where you might need your own listeners. 

 

Happy tweening.

 

[OSUblake]

11 hours ago, PointC said:

I'm not certain why that isn't documented.

 

If you ever look through the source code or inspect GSAP objects in your console, you'll find lots of undocumented stuff. Jack likes to keep stuff hidden until he sees people have a need for it. 

[PointC]

Looking at the source code makes me dizzy, but I've inspected GSAP objects many times and there is quite a bit of stuff in there. I think Jack uses the Tesla playbook: "It was always capable of that, but we're just turning that feature on & telling you about it now."