CODEWITHSUNDEEP
htmlcordovazoomingresponsive-designviewport
palAlaa
palAlaa

Reputation: 9878

Why doesn't PhoneGap render my page differently when I add a viewport meta tag?

I read about viewport that it change the logical window size used when displaying a page on iOS, Android, Opera and Firefox mobile browsers, and that we use the viewport meta tag to set the width and initial scale of the viewport.

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=5">

I tried the example without viewport and the one with viewport on my Galaxy S II cellphone, and I didn't notice any change! Also I tried to zoom-in the content but it doesn't zoom. I put user-scalable= yes in the content attribute, but it still doesn't zoom-in!

Note: I use PhoneGap to run the HTML file on my phone.

Upvotes: 2

Views: 1128

Answers (1)

The WebMacheter
The WebMacheter

Reputation: 1776

The viewport is a metatag introduced by Apple in mobile Safari in order to allow web developers to define the scale at which their sites should appear in the browser. You can read all about it here.

However, you should note that this applies to the mobile Safari browser, and not necessarily to PhoneGap (Cordova, now?). A quick search shows this (somewhat recent) thread, and it seems that currently there is no way to do this.

Upvotes: 1

Related Questions