Any way to remove the html5 border?

Development Platform & Builds
, , , , ,
1

Is there any way to get rid of this ugly border and UI without going into fullscreen mode when running html5 builds?
thanks

234587-html.jpg
234587-html.jpg2087×1035 224 KB

2

you can edit the “shell (template) file” at:

  • Engine/Build/HTML5/GameX.html.template

this file is used to build the final html file when packaging your project.

that said, to get rid of the buttons, change:

<div class="row buttonarea text-center" id="buttonrow">

to:

<div class="row buttonarea text-center" id="buttonrow" style="display:none">

and, to give your game full screen width and height:, edit:

.wrapper {
...
	height: 480px; /* initial height, will be dynamically adjusted at runtime */
	max-width: 95%;
...
Module['canvas'].style.width = cssWidth + 'px';
Module['canvas'].style.height = mainArea.style.height = cssHeight + 'px';

to:

.wrapper {
...
	height: 100%;
	max-width: 100%;
...
Module['canvas'].style.width = '100%';
Module['canvas'].style.height = mainArea.style.height = '100%';

you can play around with the pixel or percentage ratios to ensure your project is not distorted. Use the web inspector to edit those layers live to help you find those values faster.

that, should give you what you want.

3

Thanks, that’s perfect!