Jump to content
Search Community

Latest draggable build (0.13.0) with defined type and touch devices bug. Worked in old Draggable build (0.11.0)

sumimasenga test
Moderator Tag

Go to solution Solved by Diaco,

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

Hi!

 

Look at these links using a touch device. Im using iphone 4s with safari browser. 

 

The problem was working fine in the old draggable build. If I have a draggable object with only type:'x'. I can activate the drag if I move my finger in a vertical direction and then move it to a horizontal direction. But with the latest draggable build it doesnt work. It only activates a drag if the touch is a horizontal direction from the start and I tried with lockAxis:false with no success.

 

Old draggable library (0.11.0):

New draggable library (0.13.0):

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

 

Can you get the same problem?

 

Thanks!

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

Link to comment
Share on other sites

  • Solution

Hi sumimasenga  :)

 

This isn't a BUG !!! in fact this's one of the last version GREAT added options , that allow you to have Native Scrolling on touch devices :

 

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.

 

pls check out this codepen Demo to see how that works : 

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

 

but if you don't want that useful behavior on touch devices , you can easily set this in your draggable creation vars : allowNativeTouchScrolling : false

Draggable.create("#box", {
  type:'x',
  throwProps:true,
  allowNativeTouchScrolling:false
});

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

  • Like 5
Link to comment
Share on other sites

Im so impressed that you guys answer so quickly. I really appreciate it :)

It works now thanks alot!

 

I didnt find the allowNativeTouchScrolling in the documentation. Im looking here: http://greensock.com/docs/#/HTML5/GSAP/Utils/Draggable

Am I looking at the wrong place? I dont want to miss any useful functions and properties! :)

 

Thanks alot Diaco.AW!

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.
×
×
  • Create New...