Hope it helps.Ī pure CSS approach adding to solution of above. The blue border shows you the edge of the resizing canvas, and is always along the edge of the window, visible on all 4 sides, which was NOT the case for some of the other above answers. then draws the new borders accordingly. Resets the canvas dimensions to match window, Runs each time the DOM window resize event fires. border that resizes along with the browser window.Ĭontext.strokeRect(0, 0, window.innerWidth, window.innerHeight) Draw canvas border for the first time.
Window.addEventListener('resize', resizeCanvas, false) Register an event listener to call the resizeCanvas() function
Start listening to resize events and draw canvas. Obtain a graphics context on the canvas element for drawing. HtmlCanvas = document.getElementById('c'), Obtain a reference to the canvas element using its id.
0 kommentar(er)
