I'm trying to use / to implement swiping on a Meteor app to shift between templates in Iron Router.

It works beautifully on iOS and Android but on Windows Phone, the OS' native swipe gesture (swiping right in the browser moves one page back in history) interferes with the user's swiping action.

Is there any way I can disable this?

Also which other platforms have similar functionality which would prevent the user from swiping in the web app effectively?

As an example, this app also uses the same library to implement swipe gestures.

Note: Using touch-action: none on the body tag does not work.

I'm trying to use http://wipetouch.codeplex./ to implement swiping on a Meteor app to shift between templates in Iron Router.

It works beautifully on iOS and Android but on Windows Phone, the OS' native swipe gesture (swiping right in the browser moves one page back in history) interferes with the user's swiping action.

Is there any way I can disable this?

Also which other platforms have similar functionality which would prevent the user from swiping in the web app effectively?

As an example, this app also uses the same library to implement swipe gestures.

Note: Using touch-action: none on the body tag does not work.

• javascript
• jquery
• meteor
• touch

1 Answer 1

I encountered the same problem on a little web application : it which was a scratch game, where the player had to swipe the finger all over the "scratchable" zone to discover what he had won.

The game was supposed to run on Windows 8.1 tablets, with IE10 on it.

We put in the css this snippet :

*{
    touch-action: none;
}

The result is to pletely deactivate any touch events on the app (including the swipe backward / forward).

But we had to reactivate the touch event only on the scratch zone, to allow the player to play :)

For this we had to add this :

#playzone{
    touch-action: chained;
}

The app still works perfectly, both on IE10 on tablets but also on Windows Phone 8.1.

(please forgive my English, it's not my mother tongue)

EDIT : After having tested more on IE, it seems that adding the touch-action:none; on the html element is enough to achieve what the OP wanted.