A good method for writing HTML5 Canvas multi-layer click event monitoring

This article mainly introduces "a good preparation method of HTML5 Canvas multi-layer click event monitoring". In daily operation, I believe that many people have doubts about a good writing method of HTML5 Canvas multi-layer click event monitoring. Xiaobian consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful for you to answer "a good compilation method of HTML5 Canvas multi-layer click event monitoring". Next, please follow the editor to study!

The code is as follows:

Document

.box > canvas {

Position: absolute

}

Function getRect (obj) {

Var x1 = obj.offsetLeft

Var Y1 = obj.offsetTop

Var x2 = x1+obj.offsetWidth

Var Y2 = y1+obj.offsetHeight

Return {

X1: x1

Y1: y1

X2: x2

Y2: y2

}

}

Function inside (x, y, rect) {

If (x > rect.x1 & & xrect.y1 & & y