Generate fullscreen

Sorry I’m new here and would like to remove the entire browser look. Keyword fullscreen. I also read the information on the topic, but where is this code inserted? enableFullscreen…

I am going to answer assuming Google Translate is correct:

Hi @jason57x,

If you are using an iframe into your published build to display your app, you can use a button element on your parent page and use its click event to enable fullscreen of your Playcanvas app. Here is the code i use:

var iframe=document.getElementById('pc-player');

iframe.requestFullScreen = iframe.requestFullScreen||iframe.mozRequestFullScreen||iframe.webkitRequestFullScreen;

var button = document.getElementById('pcfullscreen');

if(iframe.requestFullScreen) {
	button.classList.add('available');

	button.addEventListener('click',function() {

		iframe.requestFullScreen();

		if(kik.enabled) {
		kik.browser.statusBar(false);}

	},false);
}

iframe.addEventListener('load',function() {
	iframe.contentWindow.focus();
});

To use the code above, you would want to create an iframe with the name ‘pc-player’ and button type object on with the id ‘pcfullscreen’ on your parent page and put the above code in tags.


<script>
var iframe=document.getElementById('pc-player');

iframe.requestFullScreen = iframe.requestFullScreen||iframe.mozRequestFullScreen||iframe.webkitRequestFullScreen;

var button = document.getElementById('pcfullscreen');

if(iframe.requestFullScreen) {
	button.classList.add('available');

	button.addEventListener('click',function() {

		iframe.requestFullScreen();

		if(kik.enabled) {
		kik.browser.statusBar(false);}

	},false);
}

iframe.addEventListener('load',function() {
	iframe.contentWindow.focus();
});
</script>

<iframe id="pc-player" src="[YOUR URL HERE]" style="width:1280px;height:720px;border:0" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>

<button id="pcfullscreen">Fullscreen</button>
1 Like

Hello @jason57x and welcome! I have translated your topic. Please try to use English language only.

he …
hab mit fullscreen noch nichts zu schaffen gehabt aber folgenden foreneintrag gefunden:

also scheinbar gibts enableFullscreen nicht mehr… geht wohl mit document.body.requestFullscreen(); …
ich wuerds uebrigens wenn du kannst auf englisch versuchen. die leute sind hier sehr hilfsbereit und reagieren schnell…

1 Like

German?

obviously. . i adviced him to use english language though …

vielen dank für die schnelle reaktion und alle hinweise
werde es morgen probieren und bin zuversichtlich, das klingt plausibel

und ja… deutsch :slight_smile:

Hi guys, thanks for the help, it works.
Now comes the next step the sensible division of the screen content to cut off depending on the device no content that is important.