• Advertisement
Sign in to follow this  

Where do I start with screen positions in JavaScript without a library?

This topic is 519 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

I would like to know where to start in positioning things on the screen in JavaScript in the browser.  I'm not sure where to begin, as it's not anything like regular web programming.  I don't know how to visualize the solution.

 

Like this,

 

http://eigen.pri.ee/forum/viewtopic.php?f=11&t=74

 

See how he has stuff everywhere.  I mean it's not like a regular webpage.  The source code is a lot of "stuff," so I don't know where to start.  HTML5 canvas?

 

Thanks for any beginning guidance.

Share this post


Link to post
Share on other sites
Advertisement

Start with web page as simple as this:

<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <title>The Game</title>
    </head>
    <body>
        <canvas id="canvas" width="1024" height="768" />
        <script src="game.js" />
    </body>
</html>

Loaded script then will hook document's callbacks (document.addEventListener("mousemove", ... ) etc),

grab canvas context with document.getElelementById('canvas').getContext("2d" or "webgl"), then draw something using context's functions.

Here's docs for 2d canvas context: https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D

 

Basically it's like having some engine, Love2D-like, or something similar, just different in available functions and resources access.

Share this post


Link to post
Share on other sites
Sign in to follow this  

  • Advertisement