如何使用JavaScript将图像插入alertify.js警报？

问题描述

我想创建一个弹出式对话框，其中包含一个大图片和一个确定按钮，对于这个我想自定义。

I want to create a pop-up dialog with a large image and an OK button and for this I'am trying to customize the alerts of alertify.js .

我的想法是创建一个自定义 css 类的所有这些弹出警报与默认图像url，然后更改url background-image：url（images / level_10.jpg）; 当我使用 JavasScript 创建正确的图像弹出窗口（因为你可以传递自定义 cssClass 调用函数）;​​

My idea was to create a custom css class for all these "popup-alerts" with an default image url, and then change the url background-image: url(images/level_10.jpg); when I create the pop-up to the right image with JavasScript (because you can pass in a custom cssClass when you call the function);

我不知道这是否可能。

也许更好的方式来自定义alertify.js来实现这一点？

Or is there maybe better way to customize alertify.js to achieve this?

推荐答案

您可以覆盖alertify的CSS类。

You can override the CSS class of alertify.

看下面的例子：

在你的case，你只是想覆盖 .alertify CSS类这样：

In your case, you just want to override .alertify CSS class like this :

.alertify.popup1 {
    background: url(path/file1.png);
}
.alertify.popup2 {
    background: url(path/file2.png);
}
/* etc */

$("alert1").onclick = function () {
 alertify.alert("This is an alert dialog", function() {}, 'popup1');
};
$("alert2").onclick = function () {
 alertify.alert("This is an other alert dialog", function() {}, 'popup2');
};

这篇关于如何使用JavaScript将图像插入alertify.js警报？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！