Home/ Questions/Q 8902213
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-15T01:33:20+00:00

<!doctype html> <html> <head> <title>Canvas test</title> </head> <body> <script type=text/javascript> c = getElementById(‘canvas’); ctx

  • 0
<!doctype html>
<html>
<head>
<title>Canvas test</title>
</head>
<body>
<script type="text/javascript">
c = getElementById('canvas');
ctx = c.getContext("2d")'
ctx.fillRect(10,10,10,10);
</script>
<canvas id="canvas" height ="100" width = "100"></canvas>
</body>
</html>

I have tried this on Chrome and IE 9, and neither of them display anything. Do you know why doesn’t this work?

It’s probably something stupid, and my friend is asking me to post this as he’s too lazy to sign up, but I couldn’t figure it out myself.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You need to put your code in a onload function.

    For example:

    window.onload = function() {
    c = document.getElementById('canvas');
    ctx = c.getContext("2d");
    ctx.fillRect(10,10,10,10);
};

    The reason for this is because you javascrpt code will be running before the <canvas> renders, and you want it to run afterwords.

    Demo: http://jsfiddle.net/maniator/nCf7Y/

    • 0