HTML and CSS Reference
In-Depth Information
highlightTile
(
tileId
,
col
*
32
,
row
*
32
)
}
else
else
{
var
var
col
=
Math
.
floor
(
mouseX
/
32
);
var
var
row
=
Math
.
floor
(
mouseY
/
32
);
context
.
putImageData
(
imageData
,
col
*
32
,
row
*
32
);
}
}
theCanvas
.
addEventListener
(
"mousemove"
,
onMouseMove
,
false
false
);
theCanvas
.
addEventListener
(
"click"
,
onMouseClick
,
false
false
);
}
<
/script>
</head>
</head>
<body>
<body>
<div>
<div>
<canvas
<canvas id=
"canvas"
width=
"256"
height=
"256"
style=
"position: absolute;
top: 50px; left: 50px;"
>
Your browser does not support HTML5 Canvas.
</canvas>
</canvas>
</div>
</div>
</body>
</body>
</html>
</html>
NOTE
As of this writing, you must run this application from a web server in order to manipulate the local
tanks_sheet.png
file on the canvas. If you are using the Safari or Firefox browser (version 5.1 and
19.02,respectively,asofthiswriting),youcantesttheapplicationonalocaldriveanditwillfunction
properly.