SweetAlert2:设置对话框高度

时间:2017-12-22 02:13:57

标签: javascript angularjs typescript sweetalert

对于sweetAlert2我注意到没有“height”属性,但是有一个“width”属性,有没有办法将对话框的高度设置为80%?

由于

https://limonte.github.io/sweetalert2/

3 个答案:

答案 0 :(得分:2)

您必须使用自定义CSS类,如下面的代码段所示:



const test = () => {
  swal({
     title: 'Test',
     customClass: 'swal-height'
  });

};

.swal-height {
  height: 80vh;
}

<script src="https://unpkg.com/sweetalert2@7.1.2/dist/sweetalert2.all.js"></script>

<button onclick="test()">test</button>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

对我而言,自定义SweetAlert的CSS的唯一方法是在全局styles.scss文件中覆盖它们(包括!important)。

exp:

case

答案 2 :(得分:-1)

自 7.21.0 版起添加了修复程序。您可以在 Sweet Alert 选项中添加“heightAuto: false”选项,问题就解决了。

Swal.fire({
    heightAuto: false,
    title: 'Hello,
    Text: 'This is an alert'
});

此处示例:https://jsfiddle.net/y3nf3fjg/1/