Question

我正在使用Timmywil的panzoom插件 https://github.com/timmywil/jquery.panzoom

在我的项目中。它一直运作良好至今。但自从Chrome的最新更新发布以来，它已经被打破了。它会缩放一次但如果您开始平移视图则会重置为原始位置。它适用于鼠标滚轮，但捏缩放不起作用。此问题出现在Android手机上的Chrome版本55上。这是分叉测试小提琴链接

http://jsfiddle.net/trupti11/c3umpgud/

var $x = $('#x'), $y = $('#y');
var svg = $('svg').on('mousemove', function(e) {
    $x.text(e.clientX);
    $y.text(e.clientY);
    })[0];
var box = svg.getBoundingClientRect();
var $panzoom = $("#viewport").panzoom({
    cursor: 'default',
    increment: 4,
    minScale: 0.5,
    maxScale: 16,
    rangeStep: 2,
    transition: true,
    duration: 200,
    easing: "ease-in-out",
    $zoomIn: $('.zoom-in'),
    $zoomOut: $('.zoom-out'),
    $zoomRange: $('.zoom-range'),
    focal: {
        clientX: 108,
        clientY: 132
    }
});

var instance = $panzoom.panzoom('instance');
instance.parentOffset = { top: 32, left: 8 };

$('#pan').on('click', function(e) {
    $panzoom.panzoom('pan', 10, 10, { relative: true, animate: true });
});

我尝试使用最新的插件文件进行更新，但没有更改。

任何人都能解释一下吗？

这是另一个在Android Chrome版本55中无效的演示页面。

http://timmywil.github.io/jquery.panzoom/demo/

Answer 1

这是适合我的解决方案。我不得不更新到新的js文件和评论行

"this.panning = true"

第1164行。
由于这种变化，另一个问题是我的图像视图向下移动到页面div的中心。但是我通过指定主页div的高度来对它进行排序。

查看以下链接了解更多详情 https://github.com/timmywil/jquery.panzoom/issues/308
https://github.com/timmywil/jquery.panzoom/issues/303

chrome 55中的缩放平移问题

1 个答案: