[ 
https://issues.apache.org/jira/browse/CB-14093?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=16478212#comment-16478212
 ] 

Wojciech Trocki edited comment on CB-14093 at 5/16/18 10:43 PM:
----------------------------------------------------------------

Basin on documentation in W3C suggested configuration is invalid. When the page 
is first loaded the initial-scale property controls the initial zoom level ie 1 
Viewport pixel = 1 CSS pixel. User-scalable, maximum-scale and minimum-scale 
properties control how the user is able to zoom the page in or out. 
If we set  width=device-width and scale will be different than 1 then content 
will automatically exceed the available window. That's why things are 
draggable. Not sure why in some cases things aren't but that's something to log 
into chrominium bugzilla.

This can be seen not only on mobile, but in regular browser when using mobile 
phone mode in inspector. Check:
https://www.w3schools.com/css/example_withviewport.htm

It is not Cordova issue.

In order to control device and view sizes use CSS media queries to apply 
different styling for small and large screens.
I would say 1 is recommended value that will work here.


was (Author: wtrocki):
Basin on documentation in W3C suggested configuration is invalid. When the page 
is first loaded the initial-scale property controls the initial zoom level ie 1 
Viewport pixel = 1 CSS pixel. User-scalable, maximum-scale and minimum-scale 
properties control how the user is able to zoom the page in or out. 
If we set  width=device-width and scale will be different than 1 then content 
will automatically exceed the available window.

This can be seen not only on mobile, but in regular browser when using mobile 
phone mode in inspector. Check:
https://www.w3schools.com/css/example_withviewport.htm

It is not Cordova issue.

In order to control device and view sizes use CSS media queries to apply 
different styling for small and large screens.
I would say 1 is recommended value that will work here.

> Setting a viewport scale factor causes page to be draggable
> -----------------------------------------------------------
>
>                 Key: CB-14093
>                 URL: https://issues.apache.org/jira/browse/CB-14093
>             Project: Apache Cordova
>          Issue Type: Bug
>            Reporter: Doug Davies
>            Priority: Major
>
> I'm using Cordova 8.0.0.  When I set the following viewport meta tag
> <meta name="viewport" content="user-scalable=no, initial-scale=1.13, 
> maximum-scale=1.13, minimum-scale=1.13, width=device-width">
> The screen is draggable (at least on Android).  If I change to 1.14, then it 
> is not.  It seems very random… 1.11, 1.12, 1.14, 1.17, 1.18, 1.19 work… 1.13, 
> 1.15, 1.16 don’t.
> You can reproduce this as follows:
> {code:java}
> cordova create demo
> cd demo
> cordova add platform [email protected]
> change viewport in index.html to
> <meta name="viewport" content="user-scalable=no, initial-scale=1.13, 
> maximum-scale=1.13, minimum-scale=1.13, width=device-width">
> cordova run android
> {code}
> My real app does this dynamically so that tablets scale the UI up 
> appropriately.  I swear this has been working until recently, but I can't say 
> for sure.  On iOS the viewport-fit=cover seems to be taking care of this, 
> although I didn't add that until I needed iPhone X support.
> Copying [~wtrocki] as instructed.
> I tried this on iOS and without that it also scrolled around.  So not sure in 
> what component the problem lies.
> I've tried this on a stand-alone (non-cordova page) and it ALWAYS seems to be 
> scrolling.  So Cordova must be intervening and helping at least some of the 
> time.
> Here's the pages I was attempting
> [http://funkyvisions.github.io/index1.html]
> [http://funkyvisions.github.io/index1.13.html]
> [http://funkyvisions.github.io/index1.14.html]
> [http://funkyvisions.github.io/index2.0.html]
>  



--
This message was sent by Atlassian JIRA
(v7.6.3#76005)

---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to