问题描述
我在canvas标签中绘制了一个图片。如何向其中添加事件?我想在用户点击该图片时执行某些操作。
character.addEventListener('click',function 'foo');},true);
/ *字符是画布中的var(图像对象)* /
谢谢。
更多,我发现这个答案不工作
例如,我创建了一个动态画布图库在github上:
每次调整窗口大小时,我会重新计算绘制的每个图像的x,y,当单击画布时,运行碰撞函数。
基本上你从点击事件中获取x,y值,并检查在这些坐标上是否有任何东西。
这是另一个在画布上注册点击事件的好链接:
I've draw an image inside a canvas tag. How could I add events to it? I want to do something when user clicks in that image.
character.addEventListener('click', function() { alert('foo'); }, true);
/* character is a var (image object) within a canvas */
Thank you.
get click event of each rectangle inside canvas?
Further more, I have found that this answer does not work in Mozilla.
Instead use clientX instead of offsetX.
Example, I have created a dynamic canvas image gallery on github at: https://github.com/michaelBenin/fi-test
Every time the window is resized I recalculate the x, y, of each image drawn, from there I run the collisions function when the canvas is clicked.
Basically you get the x, y value from the click event and check to see if there is anything on the canvas at those coordinates.
Here is another good link on registering click events inside of canvas: http://eli.thegreenplace.net/2010/02/13/finding-out-the-mouse-click-position-on-a-canvas-with-javascript/
这篇关于画布中元素中的事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!