Hi all,
I'm trying to get a grid of black squares but need to make a border that is transparant so i can see the squares instead of just one big black square..
here is my code:
<script>
var can = document.getElementById('blokjes');
var ctx = can.getContext('2d');
var pattern = document.createElement('canvas');
pattern.width = 20;
pattern.height = 20;
var pctx = pattern.getContext('2d');
pctx.fillStyle = "rgb(0, 0, 0)";
pctx.fillRect(0,0,10,10);
pctx.fillRect(10,10,10,10);
pctx.fillRect(0,10,10,10);
pctx.fillRect(10,0,10,10);
var pattern = ctx.createPattern(pattern, "repeat");
ctx.beginPath();
ctx.moveTo(0, 0);
ctx.lineTo(500, 0);
ctx.lineTo(500, 500);
ctx.lineTo(0, 500);
ctx.closePath();
ctx.fillStyle = pattern;
ctx.fill();
</script>