javascript - Safari 中的 CSS 缩放问题

Question

我已经尝试使用 CSS 缩放属性很长一段时间了。我拍摄了一张 1920X1200 尺寸的大图像，并将其水平切成 10 block (1920X120 每 block 10 block )。我在这样的网页上定位图像 -

<img src="images/img0_01.jpg" style="position:absolute; top:0px; left:0px;">
<img src="images/img0_02.jpg" style="position:absolute; top:120px; left:0px;">
.
.
.
<img src="images/img0_10.jpg" style="position:absolute; top:1080px; left:0px;">

然后我像这样对整个文档应用缩放 -

$("body").css("zoom","54%"); 

我期望的是将所有 10 张图片都视为一张图片，而且我在 Firefox/Chrome 中看到的效果与预期一致。但是在 Safari 中，我看到图像之间存在间隙(请参阅随附的屏幕截图)。如何解决？

注意 所有图片的margin、padding 和border 都设置为0。图片的定位应该只有 top 和 left 值才是绝对的。

将不胜感激任何形式的帮助。谢谢。

Live Demo

Answer 1

我发现一种有效的快速破解方法是让图像仅相隔 119 像素而不是 120 像素。在 Safari 上看起来好多了，在 chrome 上看起来仍然不错。