4

I am attempting to have a CANVAS element in a webpage that uses the HTML5 Fullscreen API to go fullscreen. Upon entering fullscreen on Chrome for Android, the meta viewport scale is changed to a value of 1, disregarding the setting set and reducing the resolution by 75%. It works as expected in Firefox Mobile on Android.

Question is, how to keep the full resolution of the mobile device available to a CANVAS element when entering fullscreen via fullscreen api? I set the scale via meta to report the full screen size to javascript and allow a high resolution canvas on a high resolution dpi device.

<meta name="viewport" content="width=device-width, initial-scale=.25, minimum-scale=.25, maximum-scale=.25, user-scalable=yes" />

Upon entering fullscreen via the HTML5 fullscreen api, the reported size is quartered, as if the scale was set to 1.

Here is an example http://3d-360.com/gigapan/broken.html

Aleks G
  • 56,435
  • 29
  • 168
  • 265
stereopan-com
  • 161
  • 8
  • There is no way to do what you want in Chrome, the scale is hard fixed to 1 when you enter fullscreen. Why do you keep a larger canvas and zoom out? Couldn't you get the same effect by using a canvas that's the device-width and just drawing smaller? – David Bokan Aug 31 '16 at 13:29
  • Possible duplicate of [The values of meta viewport attribute are not reflected when in full screen mode in android chrome browser](https://stackoverflow.com/questions/47954761/the-values-of-meta-viewport-attribute-are-not-reflected-when-in-full-screen-mode) – Agnel Vishal Mar 19 '18 at 11:18

0 Answers0