CODEWITHSUNDEEP
javascriptsvgsnap.svg
OndrejRohon
OndrejRohon

Reputation: 337

Snap.svg click event on child of group that is draggable, event not triggering on touch devices

http://codepen.io/anon/pen/dpiBs

I have a group, that contains two rectangles. Red rectangle has click event bounded on it, that shows alert msg. Parent group is draggable.

On computer, when you drag the red rectangle, it moves and on the end of drag, it shows alert. That is ok. But on touch device (tested on iPad 3 with iOS7), you can drag those rectangles, but click event on red rectangle never executes.

Is there any way how to enable that click event on red rectangle on touch devices? Also, any suggestions how to get rid of that click event on the end of the drag on computer is more than welcome.

Thanks for help.

Upvotes: 1

Views: 1717

Answers (1)

OndrejRohon
OndrejRohon

Reputation: 337

Ian pointed me to right direction. On touch devices we have to use touchstart and touchend events. I use modernizr to detect touch device. Here is the new codepen, which is working for me: http://codepen.io/anon/pen/yDKep

Thanks a lot Ian!

Edit: my solution doesn't work on android. It is better to check if target element on touchstart and touchend have same id for example.

Upvotes: 1

Related Questions