Pregunta

How can I disable zoom-in and zoom-out capability in responsive design pages while using iPad, iPhone and/or some other smartphone.

Is there any way to control it?

¿Fue útil?

Solución

Create a META viewport tag, and set the user-scalable property to 'no', like this:

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

Updated answer:-

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

Otros consejos

This pretty much discriminates against anyone over 30, suppressing zoom just forces them to use reading glasses. Which may be your intent.

One of the workarounds for such users is to use RDP or VNC to view a desktop browser and "pinch" the view of that.

Question should maybe read "how to disable" or "how to suppress". You should of course discern your devices using the user agent string.

To Disable Zoom Please Add this Script

<script type="text/javascript">
document.addEventListener('touchmove', function (event) {
  if (event.scale !== 1) { event.preventDefault(); }
}, { passive: false });
</script>
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top