编程语言
首页 > 编程语言> > javascript-隐藏一个画布会使另一画布无法选择

javascript-隐藏一个画布会使另一画布无法选择

作者:互联网

在Fabric.js中,如果有两个画布,并且其中一个使用jQuery隐藏,则剩余的画布将变得不可编辑.为什么会这样?有解决这个问题的方法吗?这是问题的jsfiddle.

HTML

<canvas id="c" width="200" height="50"></canvas>
<hr/>
<canvas id="c2" width="200" height="50"></canvas>
<button id="hide">hide the top canvas</button>

的CSS

var canvas = new fabric.Canvas('c');
var canvas2 = new fabric.Canvas('c2');
canvas.add(new fabric.Text('hello', {left: 50, top: 40}));
canvas2.add(new fabric.Text('hi', {left: 20}));
$('#hide').click(function() {
    $('#c').parent().hide();
});

解决方法:

只需调用canvas.calcOffset();隐藏其他画布后,在可见画布上显示.

我更新了你的jsfiddle:http://jsfiddle.net/pVE33/7/

标签:canvas,fabricjs,javascript
来源: https://codeday.me/bug/20191122/2058349.html