metafizzy / flickity

:leaves: Touch, responsive, flickable carousels
https://flickity.metafizzy.co
7.53k stars 603 forks source link

iOS 15 touch drag is not working properly #1177 #1182

Closed milanidavide closed 2 years ago

milanidavide commented 3 years ago

Hello, this pull request addresses the issue #1177.

The problem is only present on Safari, not on other browsers such as Firefox. When the Tab Bar moves, dragging is stopped and many resize events are triggered. Preventing touchmove while dragging and resize while animating, appears to be effective.

While this pull request may not be the final solution, I hope it can be a good starting point.

vasanthangel4 commented 3 years ago

@milanidavide @nikopol-fw @bluedge @PietM @Hlsgs @ale-grosselle

IOS 15 touch drag/page dots is not working properly. i did not see the any error in the log. could you please guide me to fix this issue.

below changes i have already added it but it is not helped. CSS: .flickity-slider { -webkit-overflow-scrolling: touch; } JS:

// PATCH iOS 15 horizontal drag bug this.flkty[id].on('dragStart', () => (document.ontouchmove = () => false)); this.flkty[id].on('dragEnd', () => (document.ontouchmove = () => true));

vasanthangel4 commented 3 years ago

@milanidavide : i have using below mentioned single js file, but it is not working the iOS 15 for swipe , but iOS 14, Android devies , Deskop working fine.

desandro commented 2 years ago

Thank you for this contribution! I did add a fix to check for resize. And for touch events - I ultimately resolved this by using touchstart events over pointerdown in order to have better control over event.preventDefault(). Sorry to pass on this one!