javascript - 使 XUL 对话框窗口在不适合屏幕时显示滚动

标签 javascript modal-dialog firefox-addon xul xulrunner

我正在构建一个在 Xulrunner(版本 23)上运行的独立 Win 应用程序。在应用程序中,我需要打开一个比客户端的典型屏幕高度(1024)稍大的模式对话框。在更大的屏幕上,我希望显示完整的模式窗口大小。在较小的屏幕上,所有内容都应该可以通过滚动垂直滚动条来访问。

总结一下这种情况下模态窗口的理想行为是:

A.它打开后可以垂直和水平容纳所有内容。但是...

B.如果它不适合可见区域,它应该停在边界处,并在不适合屏幕的轴上显示滚动条。

为了实现这一目标,我尝试了以下方法:

  1. "scrollbars=yes" 添加到 window.openDialogstrWindowFeatures 参数称呼。这似乎根本没有效果。这样做违反了要求 B。

  2. 在对话框的最外层元素上使用style="overflow: auto"。然后,当对话框超出屏幕时,新窗口将显示滚动条。但它与屏幕边框和底部任务栏的配合不太好。它结束于屏幕底部边缘下方几个像素。看图:

这里是a test application我已将上述两种方法的演示放在一起。

在问这个问题之前,我已经寻找过答案。这是我能找到的最好的:

我仍在寻找解决方案或解决方法。任何想法或建议将不胜感激!

最佳答案

我的初步想法:您对此有何看法:在调整大小事件中,如果大小超出屏幕高度,请将其调整为屏幕高度,然后启用滚动条。也可以调用窗口 centerWindowOnScreen 函数,我不确定它是否调整窗口大小以保持在屏幕内,也许只是像函数所说的那样将其居中:

感谢@SergeyAvdeev 的片段:

window.addEventListener('resize', function(event) {
    // If the window is too large resize it to fit the available screen
    var outer = windowOuter(),
        avail = available();
    if (outer.x > avail.x || outer.y > avail.y) {
        window.resizeTo(Math.min(outer.x, avail.x), Math.min(outer.y, avail.y));
    }
}, true);

关于javascript - 使 XUL 对话框窗口在不适合屏幕时显示滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25193331/

相关文章:

javascript - Capybara 无法识别动态添加的 DOM 元素?

jquery-ui - 测试页面上是否存在 jQuery UI 模式对话框或替代方案

火狐扩展开发和sqlite

c# - 如何在 ASP 中使用 JavaScript 使用 DropDownList 的值填充 TextArea

javascript - 数组作为 JavaScript 中 protected 对象属性

javascript - jquery生成模态框

firefox - 将 Firefox 插件上传到 AMO 时缺少 manifest.json

javascript - nsICacheService 在 Firefox 38 中不起作用

javascript - getJSON 只返回 [object Object],[object Object]

css - Bootstrap Pop-up Modal 未显示。相反,我得到黑屏