logo
Search:

Login:


Forgot Details? Sign-up

forum >> Programming questions >> Game Development

position scene to middile of screen

Posted Nov 23 2013 at 2:24 PM by
josh higgi (html5fan)
Is there a way to do this with percentage?
AuthorMessage
Andy
Posted: Mar 26 2014 kl. 1:48 PM

Well, the canvas element is a DOM element, so it can be positioned with the margin: auto mechanism, so in theory, it's quite easy to position the canvas. However, for technical reasons, I chose to position the canvas absolutely.

Here's why: If you're using mouse input, the mouse will return its position on the PAGE, not on the CANVAS. If I want to know where the mouse is on the canvas (which is important in gaming) I have to subtract the mouse position from the canvas position, so I need to know the canvas position exactly in pixels. This is only possible if I position the canvas with absolute positioning.

So, if your game does not include mouse input, or you don't care that the mouse input will be off a little bit, you can override the canvas' style and use ordinary CSS to center the canvas.

In gaming, I normally have a default screen size in mind, so I'll just eyeball and test with absolute positioning to get the canvas where I want it to be.