关闭

使用jTopo给Html5 Canva中的元素添加鼠标事件

标签: canvashtml5鼠标事件jtopo
2658人阅读 评论(1) 收藏 举报

使用Html5的时候,在Canvas上绘制的东西是不能响应鼠标事件的,但是使用jTopo添加事件非常简单,效果如下:

http://www.jtopo.com/demo/helloworld.html


代码示例:

			var node = new JTopo.Node("Hello");							
			node.setLocation(409, 269);

			node.mousedown(function(event){
				if(event.button == 2){
					node.text = '按下右键';					
				}else if(event.button == 1){
					node.text = '按下中键';					
				}else if(event.button == 0){
					node.text = '按下左键';	
				}				
			});
			
			node.mouseup(function(event){				
				if(event.button == 2){
					node.text = '松开右键';					
				}else if(event.button == 1){
					node.text = '松开中键';					
				}else if(event.button == 0){
					node.text = '松开左键';	
				}
			});	
			node.click(function(event){					
				console.log("单击");				
			});	
			node.dbclick(function(event){				
				console.log("双击");				
			});
			node.mousedrag(function(event){				
				console.log("拖拽");
			});	
			node.mouseover(function(event){				
				console.log("mouseover");				
			});
			node.mousemove(function(event){				
				console.log("mousemove");				
			});	
			node.mouseout(function(event){				
				console.log("mouseout");				
			});	


0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:3772次
    • 积分:56
    • 等级:
    • 排名:千里之外
    • 原创:2篇
    • 转载:0篇
    • 译文:0篇
    • 评论:1条
    文章存档
    最新评论