Hey,

My canvas is resizing everything I draw on it based on its size, including images. Is there anyway I can draw using pixel values, without the canvas resizing it?

Here is my drawing function:

Code:

---

function drawOnCanvas() {
    var b_canvas = document.getElementById("bubbles");
    var context = b_canvas.getContext("2d");
    context.setTransform(1, 0, 0, 1, 0, 0);
   
    for (var x = 0.5; x < 500; x += 10) {
    context.moveTo(x, 0);
    context.lineTo(x, 375);
    }
    for (var y = 0.5; y < 375; y += 10) {
    context.moveTo(0, y);
    context.lineTo(500, y);
    }
   
    context.strokeStyle = "#eee";
    context.stroke();
}

---

And this is how it looks like:

http://www.cephea.de/pub/canvas.png

No errors.

----- Edit ----
I have found the solution here: http://stackoverflow.com/questions/1...-to-fit-window. The fix was to set the canvas width and height before drawing:

context.canvas.width = window.innerWidth;
context.canvas.height = window.innerHeight;