动态调整CFWINDOW以拟合内容

Question

目前正在使用使用大量CFWINDOW对象的网站上工作，我想知道是否有人知道一种动态调整窗口大小的方法，以便所有内容都适合而无需滚动条。

我尝试使用溢出=可见配置，但似乎没有区别。

事先感谢您的任何建议。

Answer 1

好吧，当使用弹出窗口显示图像时，这是一种经典的任务。它是通过使用图像尺寸和调整大小的产卵窗口来完成的 window.resizeBy(w,h). 。我认为这仍然是适用的方法。

第二个类似的选项是计算服务器端的所需尺寸，然后传递到 cfwindow 属性 width 和 height. 。说，您可以将内容捕获到 cfcontent 并检查其字符长度。

请注意，当您使用文本内容时，这两种方法都不可靠，因为渲染字体对于用户而言确实有所不同。因此，保留一些额外的高度可能很有用。

其他棘手的方法是检查是否存在滚动条，以便已经打开的窗口。有一个属性 scrollHeight 您可以与之相比 clientHeight 并增加高度。这可能会在某些浏览器中产生一些丑陋的“跳跃”效果，但应该起作用。

我很感兴趣，并尝试了最后方法的快速测试。首先以W/H = 200的弹出弹出，此答案文本（上面的单词）作为内容。接下来，我在弹出窗口中这样做：

<script type="text/javascript">
window.onload = function() {

    // check the size before resize
    alert("Window Width = " + window.innerWidth + "\nWindow Height = " + window.innerHeight + "\nScrollHeight =  " + document.body.scrollHeight);

    if (window.innerHeight < document.body.scrollHeight) {
        // here's where we can play with resize steps and other specific trickery
        // now we're trying to expand size a bit
        window.resizeBy(window.innerWidth + 50, window.innerHeight + 50);
    }

    // check the size after resize
    alert("Window Width = " + window.innerWidth + "\nWindow Height = " + window.innerHeight + "\nScrollHeight =  " + document.body.scrollHeight);

}
</script>

警报＃1：

Window Width = 200
Window Height = 200
ScrollHeight =  783

警报＃2：

Window Width = 450
Window Height = 450
ScrollHeight =  358

请注意，我不是100％确定的（现在无法立即检查） window.innerWidth/Height 属性将在IE中起作用 - 您也应该考虑 document.documentElement.clientWidth/Height 属性。

希望这可以帮助。