My app displays some pages for a mobile device. Such pages have the <viewport>
tag carefully calculated so that they will fit 100% in the device screen, something like:
<meta id="sysviewport" name="viewport" content="initial-scale=0.79, minimum-scale=0.79, maximum-scale=0.79, user-scalable=no, width=device-width">
From the app, you can enter FullScreen mode via a call to the HTML5 api:
$(document.documentElement).fullScreen(true);
(the jQuery module just calls requestFullScreen()
looking for the vendor prefix, etc..)
What happens is, when in FullScreen mode, viewport scale is ignored (reset to "1" i guess). When I exit full-screen mode the viewport scale is again honored.
Is this a bug? A gray area in the documentation? Or is the expected functionality of full screen mode? Also can anybody confirm this happens also on mobile safari?
I did some tests manually scaling the <body>
myself when in fullscreen mode via a zoom
or transform
, but the performance is terrible compared to the viewport
scaling.