如何获得在Chrome中应用了CSS缩放的img的正确jQuery offset（）

Question

我试图在img上应用css缩放效果，当我执行jQuery函数offset（）时似乎返回错误的值。

我为我的问题创建了一个jsFiddle示例 ，以显示我所遇到的问题。 请在Chrome中进行检查，因为那是我遇到此问题的浏览器（我认为

如果单击“显示青蛙偏移”按钮，它将在青蛙img的offset（）。left处显示值为219，然后如果单击“缩放”按钮，则from将被放大2.0。 如果再按一次显示青蛙偏移按钮，您将看到青蛙img的offset（）。左边为101.5。

这是我用来在我的jsFiddle示例中对青蛙的img进行缩放的代码（也在上面链接）

$("#zoom-frog-button").click(function() {
    $(".frog-img").css("zoom", 2.0);
});

$("#unzoom-frog-button").click(function() {
    $(".frog-img").css("zoom", 1.0);
});

Answer 1

这似乎工作正常。 当您使用缩放样式属性时，它会增加/减小您将其应用于的元素的大小。 因此，当考虑offset（）返回相对于文档的位置时，此图像将设置缩放为2，将其大小加倍，然后将其偏移一半。 文档大小没有改变，但是图像却改变了。 我认为这就是您正在稀疏的问题吗？ 希望对您有帮助！ 编码愉快！