Increasing Prevention in Phonegap + JQuery Mobile

Question

I am creating a PhoneGap + JQuery Mobile application, but I cannot prevent it from scaling with a double click. I followed the advice provided at http://www.tricedesigns.com/2012/01/17/mobile-web-phonegap-html-dev-tips/ , in particular by adding:

<meta name="viewport" content="width=device-width, user-scalable=no" />

Does anyone know of a scalability solution?

Answer 1

Try:

<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />

This is what I use and I do not get any zooming.

Here is the Apple documentation for the meta tag viewport: http://developer.apple.com/library/safari/#documentation/appleapplications/reference/SafariHTMLRef/Articles/MetaTags.html

Answer 2

"user-scalable = no"

  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">

Hide result

,

Answer 3

The accepted solution does not seem to work in iOS10, it does:

// stop ios bounce and zoom 
document.ontouchmove = event => {
  event.preventDefault();
}; 

This will stop the movement of events reaching the root element / browser.