我想在html 5画布中捕捉网格功能

Question

我在stackoverflow.com中找到了以下代码。但是在这段代码中放置了图像。而不是图像我想要网格线。我想在画布中使用这个网格线。请帮我。

HTML：

<div class="demo">

    <div id="draggable5" class="draggable ui-widget-content">
        <p>I snap to a 80 x 80 grid</p>
    </div>

</div><!-- End demo -->

JAVASCRIPT：

$(function() {
    $("#draggable5").draggable({
        grid: [80, 80]
    });
});

CSS：

.draggable {
    width: 80px;
    height: 80px;
    float: left;
    margin: 0 10px 10px 0;
    font-size: .9em;
}
.ui-widget-header p, .ui-widget-content p {
    margin: 0;
}
#snaptarget {
    height: 140px;
}
body, html{
    background: url('http://i.imgur.com/FBs3b.png') repeat;
}