页面滚动时移动设备上的结构(画布)

Question

我观察到我们无法通过在移动设备上滑动手指来滚动网页,我们已经使用Canvas链接到Fabric覆盖全屏.

问题我由于画布不允许页面滚动如何解决它.

网址:http://dev-shree.com/sendfile/

请查看手机视图.

有没有办法解决它.

我的canvase defination代码:

(function(global) {

    "use strict";
    var canvas = new fabric.Canvas('canvas',{selection : false,controlsAboveOverlay:true,centeredScaling:true});
    var overlayimageurl = $('#myimg').val();
    canvas.setOverlayImage(overlayimageurl, canvas.renderAll.bind(canvas));
    canvas.stateful = false;

Answer 1

fabricjs canvas类有allowTouchScrolling选项Indicates whether the browser can be scrolled when using a touchscreen and dragging on the canvas

var canvas = new fabric.Canvas('canvas',
    {
        selection : false,
        controlsAboveOverlay:true,
        centeredScaling:true,
        allowTouchScrolling: true
    }
);

Answer 2

蒂姆·希尔所说的是正确的。allowedTouchScrolling：true，似乎什么也没做。如果添加pointer-events: none; 对于 upper-canvas 和 lower-canvas，您可以影响触摸画布时滚动页面的能力。