How to prevent zooming and moving page on mobile browsers?

Question

As in title, im looking for working scrypt to block zooming and if possible block moving page, it can be JQuery, JavaScript, HTML or even PHP.

I tried <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0>" But didnt work. Looking forward for helpful ideas.

Do you try answers of this article for blocking page moves: http://stackoverflow.com/questions/7949049/mobile-safari-disable-scrolling-pages-out-of-screen — Boris Zagoruiko, Aug 06 '13 at 15:39

score 1 · Answer 1 · answered Aug 06 '13 at 15:13

1

Try this one:

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

answered Aug 06 '13 at 15:13

Karl-André Gagnon

33,662
5
50
75

score 0 · Answer 2 · answered Aug 06 '13 at 15:12

0

Your above code should work. This usually works for me.

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

Here's some documentation

answered Aug 06 '13 at 15:12

VVV

7,563
3
34
55

score 0 · Answer 3 · edited May 23 '17 at 10:29

0

This meta-tags work fine for me.

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

Answers to this question discribes how to turn off moving page in safary: Mobile Safari: Disable scrolling pages "out of screen"

edited May 23 '17 at 10:29

Community

1
1

answered Aug 06 '13 at 15:12

Boris Zagoruiko

12,705
15
47
79

I don't know it exactly. try it in your project – Boris Zagoruiko Aug 06 '13 at 21:50

score 0 · Answer 4 · answered Aug 06 '13 at 15:14

0

The problem is your user-scalable=0 attribute.

It should be user-scalable=no.

user-scalable - Determines whether or not the user can zoom in and out—whether or not the user can change the scale of the viewport. Set to yes to allow scaling and no to disallow scaling. The default is yes. Setting user-scalable to no also prevents a webpage from scrolling when entering text in an input field. Available in iOS 1.0 and later.

(Apple Safari Dev)

answered Aug 06 '13 at 15:14

Jeff Noel

7,500
4
40
66

Thanks you all, zooming seems to be blocked, anyway how can i block moving page? in safari i can drag page and "see" safari "background" how to block moving page? – Aug 06 '13 at 15:28
1

@karek there is no way to block that. I believe it's iOS native – VVV Aug 06 '13 at 17:12

How to prevent zooming and moving page on mobile browsers?

4 Answers4

Linked