问题
I have a page that uses the following code when dealing with mobile devices
<meta name="viewport" content="width=device-width, initial-scale=.7, maximum-scale=2, user-scalable=1">
This code works great when viewed in a web browser on a mobile device. Now I am trying to create a Phonegap application with this very same page in an iframe in the application. However, the scaling/viewport is not working at all. Regardless of the numbers I put in for the scaling, the scale is still the same. It will not change.
The reason I am trying to do this is that my Phonegap application is tying together two external pages on the same Phonegap page via two iframes and I need both pages to be able to be viewed at one time without running out side the screen.
Anyone have any ideas as to how I can use/enable scaling using iframes in Phonegap? Thanks.
回答1:
Finally found the answer. Someone posted it on the Phonegap Google group. Here's their response:
Try setting the "EnableViewPortScale" setting to true: http://docs.phonegap.com/en/2.4.0/guide_project-settings_ios_index.md.html#Project%20Settings%20for%20iOS
So I added the following to my config.xml file and it's now scaling like I want it to. Only caveat is that you have to go lower than normal on the viewport with Phonegap to achieve the same effect.
<preference name="EnableViewportScale" value="true" />
来源:https://stackoverflow.com/questions/14862948/phonegap-iframe-page-scaling