# Fullscreen issues

**URL:** <https://phaser.discourse.group/t/fullscreen-issues/2979>\
**Category:** Phaser 3\
**Created:** [July 3, 2019, 9:35am UTC](https://phaser.discourse.group/t/fullscreen-issues/2979 "2019-07-03T09:35:10Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![ThePandaJam](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/thepandajam/32/1814_2.png) [@ThePandaJam](https://phaser.discourse.group/u/ThePandaJam)\
**Post date:** [July 3, 2019, 9:35am UTC](https://phaser.discourse.group/t/fullscreen-issues/2979/1 "2019-07-03T09:35:10Z")

</div>

I’m making a web game with several scenes. I already wrote this game in Phaser 2 and I’m upgrading existing features before I make new ones. I’m currently stuck on my title screen, where I am trying to make the game fullscreen when I click a button in the top of the screen.

This is the error I’m getting (it also stops animations from working)  
 ![image](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/5/5f177324701719eca33400f0ab21de2d5c6a4bb2.png)

Here is my game.js code:

```
    var config = {
      type: Phaser.AUTO,
      scale: {
        mode:Phaser.Scale.FIT,
        parent: 'SerolGame',
        autoCenter: Phaser.Scale.CENTER_BOTH,
        width: 1024,
        height: 640,
      },
      backgroundColor: 0x000000,
      scene:[Boot, Title],
      pixelArt: true,
    };

    var game = new Phaser.Game(config);

```

This is my title screen code:

```
class Title extends Phaser.Scene {
	constructor() {
		super("gameTitle");
	}

	preload() {
		this.load.script('webfont', 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js');
	}

	create() {
		this.background = this.add.image(0,0,"titleScreen");
		this.background.setOrigin(0,0);
		//button to activate fullscreen
		this.fullscreenButton = this.add.image(980, 10, "fullscreen").setOrigin(0.5, 0).setScale(0.1).setInteractive();
		this.fullscreenButton.on('pointerup', function () {

            if (this.scale.isFullscreen)
            {                
                this.scale.stopFullscreen();
            }
            else
            {
                this.scale.startFullscreen();
            }

        }, this);
		//start button
		this.pressStart = this.add.sprite(config.width/2, 350, "start");
		this.pressStart.setScale(1.5);
		this.anims.create({
			key:"blink",
			frames: this.anims.generateFrameNumbers('start',{
				start: 0,
				end: 1
			}),
			frameRate: 2,
			repeat: -1
		});
		this.pressStart.setInteractive();
		
		//credits text
		
		
			// self.creditsLabel.align = 'center';
			// //handle button click
			// self.creditsLabel.inputEnabled = true;
			// self.creditsLabel.events.onInputDown.add(
			// function(){
			// game.state.start('credits', true, false);
			// titlebgm.fadeOut(1000);
			// titlebgm.stop();
			// }, this);
		//start game when bg or 'press start' is clicked
		// this.input.once('pointerdown', function (event) {

        // console.log('From Title to Instructions 1');

        // this.scene.start('instructions1');

        // }, this);
	}

	update() {
		this.pressStart.anims.play('blink',true);
	}
}

```

Any help in fixing this or finding alternatives would be greatly appreciated 🙂

---

<div class="post-metadata">

**Author:** ![ThePandaJam](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/thepandajam/32/1814_2.png) [@ThePandaJam](https://phaser.discourse.group/u/ThePandaJam)\
**Post date:** [July 4, 2019, 10:12am UTC](https://phaser.discourse.group/t/fullscreen-issues/2979/2 "2019-07-04T10:12:33Z")

</div>

I’ve looked at this alternative:

`window['game']['canvas'][game.device.fullscreen.request]();`

but it makes my entire laptop crash for some reason…  
I’ll keep looking