CaN*_*aRk 4 events google-chrome canvas javascript-events fabricjs
谷歌搜索了很多,没有得到任何有用的提示/解决方案.我有这个简单的html页面,包括一些css样式,jquery,jquery-ui和很明显的Fabric.js; 在document.ready上我启动了一个ajax调用并在画布上呈现了一些内容.到目前为止一切似乎都很好但是当我需要捕捉一些鼠标事件时我什么也得不到.此行为仅在Chrome上显示(当前版本25.0.1364.97); 一切正常在Firefox或Internet Explorer上使用(v.9).这是一些js代码:
$(document).ready(function() {
//setup canvas etc.
eCanvas = new fabric.Canvas('EViewport', {
backgroundColor: 'rgba(255, 50, 50, .3)',
selection: true,
selectionColor: 'blue',
selectionLineWidth: 2
});
EViewport = $("#CanvasContainer");
viewW = EViewport.width();
viewH = EViewport.height();
eCanvas.setWidth(viewW);
eCanvas.setHeight(viewH);
eCanvas.observe('object:selected', function(options) {
if (options.target) {
console.log('an object was selected! ', options.target.type);
}
});
eCanvas.observe('mouse:down', function() {
console.log('mouse click! ');
});
eCanvas.on('mouse:down', function() {
console.log('mouse click! ');
});
eCanvas.on('mousedown', function() {
console.log('mouse click! ');
});
//... render some rectangles and stuff...
});
这是html结构(注意Eviewport.js文件包含以前粘贴的代码):
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="baseCss/jquery-ui.css" type="text/css">
<script type="text/javascript" src="baseJs/jquery.js"></script>
<script type="text/javascript" src="baseJs/jquery-ui.js"></script>
<script type="text/javascript" src="Eviewport.js"></script>
<link type="text/css" rel="stylesheet" href="Eviewport.css">
<script type="text/javascript" src="baseJs/Fabric.js"></script>
</head>
<body>
<div id="MainContainer">
<div id="CanvasContainer">
<canvas id="EViewport">
Canvas is not supported
</canvas>
</div>
</div>
</body>
</html>
在IE和Firefox上工作时,选择功能不适用于chrome.我尝试了很多东西(你可以看到我尝试用canvas.on更改canvas.observe),更改了jquery和jqueryui版本但没有改变.在谷歌浏览器上使用开发人员工具并没有太多表现.由css给出的html元素没有z-index,我尝试禁用不同的js和css,但这并没有解决问题.
我注意到问题也显示在Fabric.js的演示页面上(刚试过http://fabricjs.com/stickman/); 渲染工作,效果也没有鼠标事件或选择工作.
这是一个错误???
好的,终于找到了什么不起作用.我连接了一台Wacom设备,看起来最新的Chrome版本设置了一个关于"启用触摸的设备"的标志,这打破了我的代码.
一个简单的解决方案是改变chrome标志(chrome:// flags /)
相关文章:https: //github.com/kangax/fabric.js/issues/450
| 归档时间： |
|
| 查看次数： |
2709 次 |
| 最近记录： |