How can I enable zoom on Android?
That's right, I want to enable zooming rather than disabling it.
I have created a responsive website and all is looking good. However for some reason you can't pinch-zoom in Chrome on a Nexus 7 (running Android 4.2.2).
This is my meta tag that makes sure it shows the site with the right CSS for the screen size:
<meta name="viewport" content="width=device-width, initial-scale=1" />
Nowhere here do I say the user can't zoom. As I say, the site is responsive so there is no reason for the user to need to zoom, however if a user wants to zoom I don't want to stop them. There is no problem on the iPhone, the user can zoom if they want to. But on Android they can't. I have tried adding user-scalable=yes and user-scalable=1 but this makes no difference.
The only thing that works is removing that meta tag but then the site renders itself as if it's being displayed on a large screen so it is no longer responsive.
Is there anything I can do?
Answer
@David Lee's comment on top is correct: It seems more of a Nexus 7 thing than a Chrome problem. Google has had a lot of complaints regarding pinch-to-zoom wrt Nexus 7 and there is speculation that they are trying to work around Apple's pinch to zoom patent.
From what I know just using
<meta name="viewport" content="width=device-width, initial-scale=1">
should work.
I've looked at http://m.skyscanner.com/ as an example and it works on other devices with chrome and other browsers like Dolphin HD. And all that site has is the viewport code from above.
Chrome for Android has a way for us to force zoom - Open up the browser's main settings and tap "Accessibility," then check the option called Force enable zoom and see if this works in Nexus 7(I dont have that device so cant test it)