我目前在一个使用大量 cfwindow 对象的网站上工作,我想知道是否有人知道一种动态调整窗口大小的方法,以便所有内容都适合而不需要滚动条。
我曾尝试使用 overflow=visible 配置,但似乎没有什么不同。
提前感谢您的任何建议。
我目前在一个使用大量 cfwindow 对象的网站上工作,我想知道是否有人知道一种动态调整窗口大小的方法,以便所有内容都适合而不需要滚动条。
我曾尝试使用 overflow=visible 配置,但似乎没有什么不同。
提前感谢您的任何建议。
嗯,这是使用弹出窗口显示图像时的经典任务。它是通过测量图像大小和调整生成窗口的大小来完成的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
属性。
希望这可以帮助。