0

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

我曾尝试使用 overflow=visible 配置,但似乎没有什么不同。

提前感谢您的任何建议。

4

1 回答 1

2

嗯,这是使用弹出窗口显示图像时的经典任务。它是通过测量图像大小和调整生成窗口的大小来完成的window.resizeBy(w,h)。我认为这仍然是适用的方法。

第二个类似的选项是在服务器端计算所需的大小并传递给cfwindow属性widthheight. 比如说,您可以将内容捕获到 中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属性。

希望这可以帮助。

于 2010-06-09T06:37:23.610 回答