set non-scalable width for app on android tablets

Question

I am working on an app for android tablets using phonegap. I am converting an existing webpage, so I would prefer to not change the css or html. I am testing using a galaxy tab (android 2.2)

I want to set the viewable width to be 800px and disable the user from zooming in/out.

If I use <meta name="viewport" content="width=800px>, then the width is set correctly but the user can still scale the page.

If I use <meta name="viewport" content="width=800px, user-scalable=no">, then the user can't scale the page, but the width will be smaller (ie. the page is zoomed in, and the user has to scroll around to view the page)

The only other thing I can think of is using <meta name="viewport" content="minimum-scale=x, maximum-scale=x"> where x is some magical number which I don't know how to find.

Any help would be appreciated.

Answer 1

this worked for me:

<script>
    $(document).ready(function(){
        var vpScale = window.outerWidth/800/window.devicePixelRatio;
        var metas = document.getElementsByTagName('meta');
        var i;
        for (i=0; i< metas.length; i++) {
            if (metas[i].name == "viewport") {
                metas[i].content = "minimum-scale=" + vpScale + ", maximum-scale=" + vpScale;
            }
        }
    });
</script>