android and webos no content scaling?
Question
hey guys, i'm currently building a website optimized for mobile devices.
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
i have a dynamic javascript grid and i want no scaling on mobile devices. the line above works perfectly on the iphone however i think it does not work on android or webos. any idea how i can set a NO-SCALE mode for those mobile devices as well. So there is no pinch & zoom and the device-width is the 100% browser-width?
thank you for your tips.
regards matt
Solution
According to http://developer.android.com/guide/webapps/targeting.html#Metadata, the "user-scalable" property needs to be set to "no", not 0. So:
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;"/>
EDIT: A bit more info near the bottom of the page at Safari Reference Library - Supported Meta Tags:
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 toyes
to allow scaling andno
to disallow scaling. The default isyes
.Setting
user-scalable
tono
also prevents a webpage from scrolling when entering text in an input field.Available in iOS 1.0 and later.