How to GSAP Draggable & Linkable in Android

[waimalao]

Hi!

I´m trying to make this carousel draggable & Clikable in Android devices but it dosnt work any i´ve done.
It work great in Pc but in Android links doesn´t works. What am i doing wrong?

 

See the Pen mdOZgXM by waimalao (@waimalao) on CodePen

[ZachSaucier]

Hey waimalao and welcome to the GreenSock forums. Two questions:

1. Have you considered using pointer events instead? They work with both mouse and touch...
2. How are you picturing the mousemove working alongside the Draggable?

[waimalao]

Thanks Zach!

I made this change and work fine in mobile devices:
 

//  draggable
$(function() {
  Draggable.create( '#drag', { 
    edgeResistance: 0.5, 
    throwProps: true , 
    type:"x",
    dragClickables:true } );
});

 

[waimalao]

See the Pen jOVjjLm by waimalao (@waimalao) on CodePen

[ZachSaucier]

But you'll notice if you use movemove to move it and drag it "breaks". That's one reason why I asked the questions that I did  

[waimalao]

Yes but, i need to scroll automatically left or right while moving the mouse. 
I don´t know how to do this insted. 

[GreenSock]

I wouldn't create tweens like that with a fixed amount to scroll. It'll be really frustrating for users to make their mouse land on a link to click. 

 

Here's another way you could do it: 

See the Pen eYBqJqY?editors=0010 by GreenSock (@GreenSock) on CodePen

 

I'm just mapping the width of the screen to the maximum amount of scroll, so when your mouse is all the way to the left of the screen, it shows the left-most content, and when it's all the way on the right, it exposes that content proportionally. 

 

No need for jQuery either

 

Happy tweening!