2

tl;dr：当图像占据 100% 的宽度和高度并且用户缩小浏览器的大小时，文档的宽度和高度不会改变，因为图像会阻止它缩小。

我有一个动态绘制的 SVG 图像（由 RaphaelJS 创建），它占据了 100% 的屏幕宽度和高度。它占用的空间包括不可见但可以通过滚动看到的空间（因此它不仅仅是视口的宽度和高度，它可能超出此范围）。我需要将 SVG 画布的大小调整为文档的大小，这样当用户调整浏览器的大小时，滚动条不会只出现在图像上，并且当用户调整大小时，图像不会被截断浏览器要大。

调整大小工作正常，但调整大小有一个小故障。当用户从小到大调整大小时，这可以正常工作，并且 SVG 会展开以适合窗口，但是当用户从大到小调整大小时，实际图像会阻止文档变小，因为它是文档的一部分。效果是图像会增长但永远不会缩小，从而导致仅针对图像的滚动条，即使实际内容都适合屏幕。

以下是我目前计算 SVG 画布大小的方法：

function getDocHeight() {
    var D = document;
    return Math.max(
        Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
        Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
        Math.max(D.body.clientHeight, D.documentElement.clientHeight)
    );
}

function getDocWidth() {
    var D = document;
    return Math.max(
        Math.max(D.body.scrollWidth, D.documentElement.scrollWidth),
        Math.max(D.body.offsetWidth, D.documentElement.offsetWidth),
        Math.max(D.body.clientWidth, D.documentElement.clientWidth)
    );
}

那么我怎样才能让图像不让文档变小呢？基本上 getDocWidth 和 -Height 在计算文档的宽度和高度时需要忽略图像的尺寸。

4

1 回答 1

0

如果它是您想要宽度而不是文档当前宽度的窗口（其中包含您的图像，使其更宽），为什么不直接使用它呢？

于 2011-04-24T23:23:32.797 回答