问题
I have a site using jquerymobile. It loads an initial webpage, and then as other pages are clicked, they are loaded in an "overlay" which slides over the top.
Just like this: http://jquerymobile.com/demos/1.0a4/
..except mine has pinch zoom enabled.
I want the zoom state to be independent on each page the user sees. So, if a user starts on page one, opens an "overlay", zooms in, and then closes the "overlay" -- I want the first page to reset to the original zoom level.
Is this possible?
回答1:
No there is no way to control browser zoom. You should use JavaScript to zoom (or scale) your objects in the browser. It's best to switch pinching off by setting user-scalable
to no
回答2:
Actually, I just had to solve that specific problem myself so I hope this answer helps out someone else. The scenario I ran up against specifically is that I have a website (which is more like a web app) that was not built in a responsive design, but still intended to be mobile friendly. One of the interface features is the inclusion of a jQuery Dialog window containing a form. When a user fills out that form on a mobile phone such as a Droid or an iPhone, 9 times out of 10, the user will "pinch zoom" to fill out the form. All you need to do is trigger this function on some event, in my case, it was the click of the submit button.
function changeZoomLevel() {
var sViewport = '<meta name="viewport" content="width=960">';
var jViewport = $('meta[name="viewport"]');
if (jViewport.length > 0) {
jViewport.replaceWith(sViewport);
} else {
$('head').append(sViewport);
}
}
Of course, you will change the width attribute to whatever the width of the framework of your website is. But this will do the trick.
来源:https://stackoverflow.com/questions/5574189/is-is-possible-to-change-page-zoom-in-mobile-safari-via-javascript