Pinch to Zoom not working on some websites

Posted on Nov 6, 2011 by Paul White

Recently I was working on a new website for a client.  When I got close to completion I checked to see how it looked across various browsers ( Firefox, IE, Chrome, Opera ).  All looked great, then I tried to view it on my HTC Sensation ( Android 2.3.7 ).  Normally when pulling up a website on my cell phone the browser will zoom out to fit the entire website into the width of the screen.  Then you can drag the view around and use pinch to zoom to zoom into places you want to actually read.  However on this new site I couldn't get it working.

The Cause of the Pinch to Zoom not working

If you use google maps on your website, the latest version of google maps has an additional tag that is inserted into your Document HEAD. 

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

The key in this line of code is the "user-scalable=no", which prevents pinch to zoom from working.
to fix this just remove this attribute or change it to "user-scalable=yes".
Now pinch to zoom should work correctly on your mobile devices.

Discussion

name
Email	Needed to confirm comment, but not made public.
Website

	Email me when someone comments on this blog

When you Post your Comment, you'll be sent a confirmation link. Once you click this link your thoughts will be made public.. Posts that are considered spam will be deleted, Please keep your thoughts and links relavent to this Article