<meta name="viewport" content="user-scalable=no,
initial-scale=0.5, width=610, height=1024" />
The mobile is small,so I wan't to scale html5 to 0.5.It takes no effect via phonegap,but it's OK via chrome on iphone 5.
Is it phonegap's bug?
--------------Edit----------------
I found that if I move off the code I showed above,the chrome will still do well on scaling.The pictures are showed smaller than desktop views.It's scaled by default.
But phonegap doesn't.
How to make phonegap scale my html5?
Try this
<meta name="viewport" content="user-scalable=no, initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, width=device-width, height=device-height, target-densitydpi=device-dpi" />
Related
My scenario is I have iphone 5S device and safari browser. In this browser I opened a site (this site is included in bootstrap responsive also) with include below meta tag code.
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0">
If I opened the site with zoom in mode. everything is fine.
My problem is if open any other page of the same site it is showing zoom in view, but my requirement is if I open any page it will show normal view not in a zoom view. How can I do?
Shall I add any code in the meta tag? please suggest me
Use this
<meta id="id" name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
$(document).ready(function(){
$("#id").attr("content", "width=device-width, initial-scale=1")
})
There is a strange activity with our sites, http://beta.bridalbook.ph when view in mobile.
When view in iOS the site don't pinch, but when view in android it pinch.
Can anyone help me with this issue?
Try adding user-scalable=yes to your viewport meta tag
<meta name="viewport" id="view" content="width=device-width minimum-scale=1, maximum-scale=1" />
to give you
<meta name="viewport" id="view" content="width=device-width minimum-scale=1, maximum-scale=1", , user-scalable=no />
And I would move your Meta tage up near the top with the rest.
I am having some issues with my viewport on the mobile version of my web site. All of my elements display and are re-sized correctly within the page, however the page extends much farther then the end of the content.
Is there a way to restrict the height of my view port? Or could this possibly be a different issue I am just not seeing?
After further testing this error only occurs on Android mobile devices. Are there any know issues with Android viewports?
Remove height=device-height, from
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />
this is i found in your code
if you height=device-height, will fit the site vertical on the screen
may be you required the
<meta name="viewport" content="width=device-width">
only
Apparently i've screwed something up! After adding to home screen, I try to open the "app" and instead of using the iPhone rendering system with standalone mode etc, safari is opening it! It was working fine before, does anyone know what this could be?
Using JQM
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta names="apple-mobile-web-app-status-bar-style" content="black-translucent" />
I am developing a mobile web-application.I am using jsp,ajax,java classes.I want to stop the page zooming on browser.How it will possible?...I was used meta tag for it but it did n
This should work fine for iOS:
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' />
On android, it doesn't work for certain devices though such as HTC.