javascript - 扩展模态窗口

Question

我有一个 angular/bootstrap 应用程序，应用程序的模态窗口包含小文本区域，其中可能包含很多不适合文本区域(和模态)大小的文本。

我想在小模式窗口中添加某种按钮，这将打开新的更大的弹出窗口/模式，其中包含文本区域的格式良好的内容，例如屏幕的 90%。

我在这里问的不是代码，而是解决问题的方法。我已经尝试了几种方法，但总是卡住。

非常感谢!

Answer 1

我只会使用 JavaScript 来处理按钮的点击，以通过向模态添加一个类来扩展模态大小。

例如jQuery 示例:

$('.expand-modal').click(function() {
    $('.modal').addClass('expanded');
});

然后只需为 .modal.expanded 编写一些 CSS，确保它是屏幕大小的 90% 或您想要的任何大小。

您可能需要另一个按钮来再次最小化模态，在这种情况下，您只需执行类似 $('.modal').removeClass('expanded');

的操作