问题
Is there a possbility to disable the initial zoom you get when viewing a page with your smartphone?
I don't want to disable zoom, I'd just like the user to view the entire page (=> width) when loading it and not just a small rectangle.
I've tried several solutions suggested by others but none of them worked for me.
回答1:
Okay well that was easy. I slightly tweaked a solution I found from Google. Here's the only code that worked for me:
<meta name="viewport" content="width=960; user-scalable=yes;" />
It sets the default zoom to 960px (change to the width of your page) and still allows the user to zoom in/out.
EDIT: It looks like it allows zoom on the default Internet Browser (SGS4) but it disables zoom when using Google Chrome.
回答2:
Try add this to the head of your document:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2.0, user-scalable=yes", target-densitydpi=device-dpi />
Where initial-scale is how much you want it to be initially, maximum-scale is how much the user is able to zoom, and user-scalable is whether or not they are allowed to zoom.
The target-densitydpi=device-dpi is needed for mobile devices with a high dpi (or resolution) such as the Samsung Galaxy S4 but it is added to the end of the meta because devices such as the iPhone does not recognize it.
I haven't tested this myself on an SGS4 because I do not own one but if you want to be specific on the initial-scale of the device, can try adding media="(device-width: 480px) and (device-height: 800px)" after user-scalable where 480px is the viewport width of the SGS4 and the 800px is the viewport height of a SGS4.
So it should look like: <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2.0, user-scalable=yes", media="(device-width: 480px) and (device-height: 800px)", target-densitydpi=device-dpi />
回答3:
Add this to your head <meta name="viewport" content="width=device-width, initial-scale=1.0" />
Read up here: https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag
来源:https://stackoverflow.com/questions/17821639/disable-initial-zoom-when-viewing-a-page-with-mobile