How do I resize a canvas when entering fullscreen with canvas.requestFullscreen()?
Just take the window size in your callback:
canvas.width = window.innerWidth; // Or window.screen.available.widthcanvas.height = window.innerHeight;canvas.style.position = 'absolute'; // If you need
I used this:
original_width = canvas.width;original_height = canvas.height;canvas.onFullscreenChange.listen( (t){ if( canvas == document.fullscreenElement ){ canvas.width = window.screen.width; canvas.height = window.screen.height; } else{ canvas.width = original_width; canvas.height = original_height; }} );
document.fullscreenElement returns the element currently in fullscreen, and is used to restore the size when exiting the fullscreen again.
window.screen.height returns the full screen height, while window.screen.available.height returns the screen height, excluding the space reserved for taskbars and similar in your desktop environment. Do not use the latter, nor many of the solutions like document.body.clientHeight, canvas.offsetHeight, etc. you find around the web, they will not give the size you want.