Question

I want to set the viewport scale at runtime – should mobile browsers immediately apply the change after setting? This is what I’m trying:

var scale = 2.0;
var viewport = document.getElementById("viewport"); 
if (viewport != null) {
    viewport.setAttribute("content", 
        "initial-scale=" + scale + ", " +
        "maximum-scale=" + scale + ", " +
        "minimum-scale=" + scale + ", " +
        "user-scalable=no");
}

but it does not seem to work. Basically I want a button that doubles the viewport scale when pressed. I’m primarily targeting mobile safari.

Thanks

Answer 1

A couple of things to consider:

• The viewport content string should be comma separated, rather than a series of statements.
• minimum-scale should probably be in there, as I believe initial-scale is only for page load.