Draggable fails in Win 8 touch with type='x'

[garyw 9 Likes (Newbie)]

I am using a Windows 8.1 hybrid device and IE 11.  If I create a Draggable with type:'x', it doesn't work.  I created a CodePen to demonstrate this.  I have to touch and drag about 3 times before it works.  It works fine with a mouse.

 

See the Pen KpNbNx by anon (@anon) on CodePen

[Diaco 1,948 Likes (Superhero)]

Hi garyw 

 

pls check this out , do you still have any problem ?! ( with preview of the next release files ) : 

See the Pen bdBOYM by MAW (@MAW) on CodePen

[GreenSock 8,117 Likes (Superhero)]

Interesting - it worked fine on the Surface 3 Pro, but I occasionally saw what you were talking about on the regular Surface 2. We're about to release an update to Draggable (and all of GSAP), so I dropped that into your pen and it seems to have fixed the issue. Please verify - you can get the preview of the next release at https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/Draggable-latest-beta.js (uncompressed)

[garyw 9 Likes (Newbie)]

Hi garyw 

 

pls check this out , do you still have any problem ?! ( with preview of the next release files ) : 

See the Pen bdBOYM by MAW (@MAW) on CodePen

 

This one still fails.

[garyw 9 Likes (Newbie)]

I am using an HP Envy 15 Touch.

[garyw 9 Likes (Newbie)]

I am using an HP Envy 15 Touch.

 

Funny, using type='y' doesn't have any problem.

[garyw 9 Likes (Newbie)]

Interesting - it worked fine on the Surface 3 Pro, but I occasionally saw what you were talking about on the regular Surface 2. We're about to release an update to Draggable (and all of GSAP), so I dropped that into your pen and it seems to have fixed the issue. Please verify - you can get the preview of the next release at https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/Draggable-latest-beta.js (uncompressed)

 

This didn't work, either.

[garyw 9 Likes (Newbie)]

Okay, it seems to be working now in CodePen. It seemed to fail when part of the draggable box was below the bottom of the scrollable viewport.

 

However, it still doesn't work in my own app (which has a lot of complex code).  I am getting calls to onDrag as I drag, but within the onDrag callback, "this.x" is always 0.

[GreenSock 8,117 Likes (Superhero)]

This seems like it may be device-specific which is very odd indeed. 

 

Just curious: does it solve anything if you set allowNativeTouchScrolling:false in your Draggable's vars object? Like:

Draggable.create(".box", {
    bounds:"#demo",
    type:"x",
    allowNativeTouchScrolling:false
});

Did you try the beta version of Draggable in your app (and make sure you cleared your cache)? No dice?

[garyw 9 Likes (Newbie)]

Setting allowNativeTouchScrolling to false with the new beta code did the trick!

 

I would like to reiterate again that the only time I had trouble was when type='x'. Any other type worked fine.

[garyw 9 Likes (Newbie)]

Why is allowNativeTouchScrolling not documented?

[Diaco 1,948 Likes (Superhero)]

Hi garyw 

 

sorry about that ,

 

Draggable allows you to native touch-scroll in the opposite direction as Draggables that are limited to one axis. For example, a Draggable of type:"x" or "left" would permit native touch-scrolling in the vertical direction, and type:"y" or "top" would permit native horizontal touch-scrolling.

 

you can turn that off with adding this in your draggable creation : allowNativeTouchScrolling:false

[Carl 9,066 Likes (Superhero)]

Sorry about that. The docs have been updated (see Draggable config properties)