jquery_event_bind_load_canvas

button id has jquery event bound to run function containing canvas

by Nic Fontaine

HTML

<canvas id="myCanvas" height="300px" width="400px"></canvas>
    <button id="btn1">Load Canvas Rect</button>
<p id="demo"></p>

CSS

#myCanvas { background-color: #ddd; 
}

JavaScript

$(document).ready(function () {
    $("#btn1").click(function () {
        rect01();
    });
});

function rect01() {
    var can = document.getElementById("myCanvas");
    var ctx = can.getContext("2d");
    ctx.fillStyle = "blue";
    ctx.fillRect(0,0,50,50);
    
}